网页制作Dreamweaver CS4 - 3、使用文本和图像课件.ppt

《网页制作Dreamweaver CS4 - 3、使用文本和图像课件.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第3讲使用文本和图像教学目标3.1使用文本3.1.1功能讲解3.1.2范例解析──设置“大和小”文本格式3.1.3课堂实训——设置“天山天池”文本格式3.2使用图像3.2.1功能讲解3.2.2范例解析——设置“九寨沟”网页中的图像3.2.3课堂实训——设置“青海湖”网页中的图像3.3综合案例──编排“选择”网页教学目标掌握设置页面属性的方法。掌握添加文本的方法。掌握设置文本格式的方法。掌握插入图像的方法。掌握设置图像属性的方法。返回目录3.1使用文本3.1.1功能讲解3.1.2范例解析──设置“大和小”文本格式3.1.3课

2、堂实训——设置“天山天池”文本格式返回目录3.1.1功能讲解创建网页文档后，还要对文档设置页面属性，同时添加文本并设置其基本格式。具体内容如下。设置页面属性。添加文本。设置字体属性。设置段落版式。插入日期、水平线和空格。返回目录一、设置页面属性在当前文档中，选择【修改】/【页面属性】命令或在【属性】面板中单击按钮，将打开【页面属性】对话框。在【页面属性】对话框中，可以设置外观、链接、标题、标题/编码、跟踪图像等内容。返回目录（1）设置外观外观主要包括页面的基本属性，如页面字体大小、字体类型、字体颜色、网页背景样式、页边距等

3、。DreamweaverCS4的【页面属性】对话框提供了两种外观设置方式：【外观（CSS）】和【外观（HTML）】，如图所示。通过【外观（CSS）】分类，可以设置页面字体类型、粗体和斜体样式、文本大小、文本颜色、背景颜色、背景图像、重复方式以及页边距等。需要注意的是，通过【页面属性】对话框设置的字体、大小和颜色，将对当前网页中所有的文本都起作用。返回目录（2）设置链接通过【链接】分类，可以设置超级链接文本的字体、大小、链接文本的状态颜色和下划线样式，如图所示。返回目录（3）设置标题为了使文档标题醒目，Dreamweaver

4、CS4提供了6种标题格式“标题1”～“标题6”，可以在【属性】面板的【格式】下拉列表中进行选择。当将标题设置成“标题1”～“标题6”中的某一种时，DreamweaverCS4会按其默认格式显示。但是，读者可以通过【页面属性】对话框的【标题（CSS）】分类来重新设置“标题1”～“标题6”的字体、大小和颜色属性，如图所示。设置文档标题的HTML标签是“标题文字”，其中n的取值为1～6，n越小字号越大，n越大字号越小。（4）设置标题/编码在【标题/编码】分类中，可以设置浏览器标题、文档类型和编码方式，如图所示。

5、其中，浏览器标题的HTML标签是“”，它位于HTML标签“…”之间。（5）跟踪图像在【跟踪图像】分类中，可以将设计草图设置成跟踪图像，铺在编辑的网页下面作为参考图，用于引导网页的设计，如图所示。除了可以设置跟踪图像，还可以设置跟踪图像的透明度，透明度越高，跟踪图像显示得越明显。如果要显示或隐藏跟踪图像，可以选择【查看】/【跟踪图像】/【显示】命令。在网页中选定一个页面元素，然后选择【查看】/【跟踪图像】/【对齐所选范围】命令，可以使跟踪图像的左上角与所选页面元素的左

6、上角对齐。选择【查看】/【跟踪图像】/【调整位置】命令可以通过设置跟踪图像的坐标值来调整跟踪图像的位置。选择【查看】/【跟踪图像】/【重设位置】命令，可以使跟踪图像自动对齐编辑窗口的左上角。二、添加文本在创建的网页文档中，添加文本的方法主要有以下几种。输入文本：将光标定位在要输入文本的位置，使用键盘直接输入。复制文本：使用复制（Ctrl+C）/粘贴（Ctrl+V）的方法从其他文档中复制/粘贴文本，此时将按【首选参数】对话框的【复制/粘贴】分类选项的设置进行粘贴文本，如果选择【选择性粘贴（Ctrl+Shift+V）】命令，将

7、打开【选择性粘贴】对话框，如图所示，此时可以根据需要选择相应的选项进行粘贴即可。导入文本：选择【文件】/【导入】/【Word文档】或【Excel文档】或【表格式数据】命令直接将Word文档、Excel文档或表格式数据导入网页文档中。添加特殊符号：选择【插入】／【HTML】／【特殊字符】中的相应命令可以插入版权、商标等特殊字符，如果还要插入其他一些特殊字符，可以选择【其他字符】命令打开【插入其他字符】对话框进行选择插入即可，如图所示。返回目录返回目录三、设置字体属性字体属性包括字体类型、颜色、大小、粗体、斜体等内容。除了可以

8、使用【页面属性】对话框对页面中的所有文本设置字体属性外，还可以通过【属性】面板或【格式】菜单中的相应命令对所选文本进行字体属性设置，如图所示。返回目录（1）设置字体类型通过【格式】/【字体】中的相应命令或CSS【属性】面板的【字体】下拉列表可以设置所选文本的字体类型，如图所示。返回目录（2）设置字体颜色