网页元素的添加文字图像和链接.ppt

第3章网页元素的添加——文字、图像和链接 教学内容： 文本的添加与编辑、图像及其属性设置、设置超级链接。 教学重点和难点： 掌握文本的编辑技巧，图像属性、超级链接的设置方法。 3.1 编辑文字 在Dreamweaver中添加文本与在Word中的操作十分相似，可以参考Word中的做法。 1．添加文本 在Dreamweaver中添加文本有两种方法：一是直接通过键盘输入，二是导入已有的文档。当然也可以将其他程序窗口里文本复制到网页中。 【实例】将本书示例网站《壮族·印象》（/zhuang）根目录others中的minsu.doc文档添加到minsu.html文件中。具体操作如下： 选择菜单 “文件 | 导入 | Word文档” 命令，如下图所示 。 在弹出的对话框中选择minsu.doc文档,单击“打开”按钮。minsu.doc文档内容即刻添加到minsu.html页面中。 2．插入空格 在Dreamweaver 8处理文本，尽管与Word十分相似，但还是有许多不同之处。例如，在编辑窗口中，默认状态下，按Space键只能插入一个空格。若想在文档中添加更多的连续空格，则要选择以下方法之一： 选择菜单“编辑 | 首选参数”命令，然后在“常规”类别中确定选中“允许多个连续的空格”项。 在“插入”栏中，选择“文本”子工具栏，然后单击最右边的 （字符）按钮，在弹出的菜单中选择“ 不换行空格”命令。 按Ctrl+Shift+Space组合键。 将输入法切换到全角状态，直接按Space键。 3．插入水平线 在文档中插入水平线，只要将插入点放在要插入水平线的位置，然后执行下列操作之一: 选择菜单“插入 | HTML | 水平线”命令。 在“插入”栏的“HTML”子工具栏中单击 （水平线）按钮。 4．插入日期 ① 在“设计”视图中，将插入点定位在要插入日期的位置。 ② 选择菜单“插入 | 日期”命令或者在“插入”栏的“常用”子工具栏中，单击 （日期）按钮。 ③ 在出现的“插入日期”对话框中选择星期格式、日期格式和时间格式。 ④ 如果希望在每次保存文档时都更新插入的日期，请勾选“储存时自动更新”选项。 ⑤ 单击“确定”按钮，日期便以选定的格式出现在指定位置。 【提示】 如果选择了“储存时自动更新”，则在日期格式插入到文档中后可以对其进行编辑，方法是单击已设置格式的文本，然后在“属性”面板上选择“编辑日期格式”。 5．修改字体组合列表 【实例】创建一个“方正舒体，隶书，黑体”的字体组合。具体操作如下： ① 在Dreamweaver 8文档窗口中，单击“属性”面板上的“字体”右边按钮，在弹出的菜单中选择“编辑字体列表”选项，此时将打开“编辑字体列表”对话框。 ② 在右下方的“可用字体”区域选择方正舒体。 ③ 单击 按钮，则选择的方正舒体出现在对话框左下侧的“选择的字体”区域中。同时在“字体列表”区域中出现了新添加的字体。 ④ 重复②、③步骤，再将“隶书”和“黑体”添加字体列表中，这样就得到由3种字体组成的有先后顺序的一组字体组合。 【提示】如果要继续添加新一组字体组合，单击“编辑字体列表”对话框左上角的 按钮，再重复实例中的②、③及④步骤即可。若要删除某个字体组合中的某种字体，则在对话框中的字体列表区域中先选取该字体组合，然后在“选择的字体”区域中选择要删除的字体，再单击 按钮。 3.2 添加图像 3.2.1 Web图像格式 目前，网页中使用的图像格式主要有GIF、JPEG（包括JPG和JEPG）和PNG三种: GIF（图形交换格式）：最多只能显示256种颜色，可以制作网络动画及透明图像。适合于色彩要求较低的导航条、按钮、图标和项目符号等。 JEPG（联合图像专家组标准）：压缩率很高，可显示数大约1670万种颜色。适合于对色彩要求较高的风景画、照片等。 PNG（可移植网络图形）：是一种替代 GIF 格式的无专利权限制的格式，它包括对索引色、灰度、真彩色图像以及Alpha通道透明的支持。 3.2.2 插入图像 将图像插入 Dreamweaver 文档时，Dreamweaver 自动在HTML源代码中生成对该图像文件的引用。为了确定此引用的正确性，该图像文件必须位于当前站点中。如果图像文件不在当前站点中，Dreamweaver 会询问你是否要将此文件复制到当前站点中。 方法： ① 将光标置于要插入图像的位置，选择菜单“插入 | 图像”命令或在“插入”栏的“常用”类别中单击 （图像）按钮，此时打开“选择图像源文件”对话框。 ② 在出现的对话框中选择默认的“文件系统”选项。如果选择“数据源”选项，则将结合后台程序使用。 ③ 在“查找