网页设计与制作案例教程 陈承欢 第4单元

《网页设计与制作案例教程 陈承欢 第4单元》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第4章　页面的整体控制本章主要学习如何设置网页的整体页面属性。课程引导（1）了解Dreamweaver8的参数设置方法（2）掌握页面属性的设置方法（3）掌握设置文件头内容的方法（4）学习辅助工具的使用知识技能目标站点效果展示网页01.html的页面属性整体设置效果如图所示。图4-1网页01.html的页面整体设置效果（1）在站点“长沙世界之窗”根目录下创建一个文件夹“01页面控制”，在该文件夹中创建一个命名为“01.html”的网页文档。（2）设置“首选参数”，具体设置要求见4.1节。（3）设置网页“01.html”的外观属性、链接属性、标题属性、标题/编码

2、属性，且在浏览器中浏览网页的设置效果。具体设置要求见4.2节。（4）为网页“01.html”插入关键字和说明。本章操作任务4.1参数设置4.2设置页面属性4.3设置文件头内容4.1参数设置设置“首选参数”之前先在站点“长沙世界之窗”根目录下创建一个文件夹“01页面控制”，在该文件夹中创建一个命名为“01.html”的网页文档。在Dreamweaver8主窗口中，单击菜单【编辑】→【首选参数】或者使用快捷键“Ctrl+U”，即可打开“首选参数”对话框。1．打开“首选参数”对话框“首选参数”对话框左边的“分类”列表中列出了20种不同的类别，选择一种类别后，该类别

3、中所有可用的选项将会显示在对话框的右边参数设置区域。2．参数设置方法（1）设置启动Dreamweaver8时不再显示起始页。打开“首选参数”对话框后，在该对话框的左边的“分类”列表中选择“常规”选项，在右边“文档选项”的“显示起始页”复选框中单击，取消复选框中的选中标记，然后单击【确定】按钮。下次启动Dreamweaver8时将不再显示起始页。3．参数设置举例（2）设置站点属性“总是显示本地文件于右”。打开“首选参数”对话框后，在该对话框的左边的“分类”列表中选择“站点”选项，然后在“总是显示”列表项中选择“本地文件”和“右”即可。（4）设置复制/粘贴属性：

4、使用“编辑>粘贴”从其他应用程序粘贴到设计视图时，复制“带结构的文本及全部格式”。4.2　设置页面属性1．打开“页面属性”对话框在Dreamweaver8主窗口中，单击菜单【修改】→【页面属性】或者在“属性面板”中单击【页面属性】按钮都可以打开“页面属性”对话框。2．设置外观属性对网页“01.html”外观属性的设置要求如下：（1）“页面字体”设置为“宋体”，“大小”设置为“14px”。（2）“背景颜色”设置为“#CCFFFF”。（3）“左边距”和“右边距”设置为“80px”。下面根据属性设置要求完成网页“01.html”外观属性的设置。（1）打开“页面属性

5、”对话框。（2）左边“分类”列表中选择“外观”。（3）从“页面字体”下拉列表框中选择“宋体”作为页面中的默认文本字体。（4）在“背景颜色”文本框中可以设置网页的背景颜色一般情况下，背景颜色都设置成白色，如果不设置背景颜色，常用的浏览器也会默认网页的背景颜色为白色。为了增强网页背景效果，可以对背景颜色进行设置。（5）设置左边距和右边距在“左边距”文本框中可以设置网页左边空白的宽度，在“右边距”文本框中可以设置网页右边空白的宽.（6）设置背景图像在“页面属性”对话框中也可以设置网页的“背景图像”，其方法是：在“背景图像”文本框中输入网页背景图像的路径和名称。（7

6、）单击【确定】按钮或者【应用】按钮，完成外观属性的设置。（8）保存网页的属性设置。3．设置链接属性“链接”选项主要对页面的超链接文本的字体、颜色等进行设置。对网页“01.html”链接属性的设置要求如下：（1）网页中超链接文本默认状态下的字体设置为“楷体”、字体大小设置为14px。（2）网页中超链接文本的颜色设置为“blue”，访问过的超链接颜色设置为“purple”。（3）网页中已激活的超链接文本颜色设置为“navy”。（4）变换图像链接颜色设置为“aqua”（即当鼠标指针移动到网页中超链接文字上方时超链接的颜色为“aqua”），下划线样式设置为“仅在变换

7、图像时显示下划线”。下面根据属性设置要求完成网页“01.html”链接属性的设置。（1）打开“页面属性”对话框。（2）左边“分类”列表中选择“链接”。（3）在“链接字体”列表框中选择“楷体”，如果字体下拉列表框中没有列出所需的字体，可以单击最后一项“编辑字体列表…”，添加所需的字体。（4）在“大小”列表框中选择“14”，单位默认为“像素(px)”。（5）在“链接颜色”文本框中输入“blue”。（6）在“已访问链接”文本框中输入“purple”。（7）在“活动链接”文本框中输入“navy”。（8）在“变换图像链接”文本框中输入“aqua”。（9）在“下划线样式

8、”列表框中选择“仅在变换图像时显示下划线”。（10）