4在【css样式】.pptVIP

9.继续在“css.css”中创建基于表格“MidTd1Table”的超级链接【高级】CSS样式“#MidTd1Table a:hover”，在【类型】分类中设置文本颜色为“#FF0000”，修饰效果为“下划线”。设置超级链接CSS样式前后以及在浏览器中的显示效果，如图所示。 （二） 设置右侧栏目的CSS样式 【操作步骤】 1.选择主体部分右侧的单元格，在【属性】面板中设置其水平对齐方式为“居中对齐”，垂直对齐方式为“顶端”。 2.在“css.css”中创建【类】CSS样式“.MidTd2”，在【背景】分类中设置背景颜色为“#FFFFFF”，然后通过【属性】面板将该样式应用到右侧单元格。 3.在右侧单元格中输入一段文本，并按Enter键将鼠标光标移到下一段，然后插入一个2行4列的表格，填充为“0”、边框为“1”，间距为“3”。 4.在“css.css”中创建【高级】CSS样式“#MidTable .MidTd2 p”，在【类型】分类中设置文本大小为“16像素”，行高为“30像素”，颜色为“#006600”，在【区块】分类中设置文本对齐方式为“左对齐”。 5.将鼠标光标置于文本所在段，然后在【属性】面板中单击按钮，使文本缩进显示，如图所示。 6.将鼠标光标置于文本下面表格的第1行第1个单元格内，右键单击文档左下角的“td”标签，在弹出的快捷菜单中选择【快速标签编辑器】命令，打开快速标签编辑器，在其中添加“id=“MidTd2TableTd1””，如图所示。 7.在“css.css”中创建【高级】CSS样式“#MidTd2TableTd1，在【方框】分类中设置宽度为“150像素”，高度为“100像素”。 8.将鼠标光标分别置于第1行的其他单元格内，并右键单击文档左下角的“td”标签，在弹出的快捷菜单中选择【设置ID】／【MidTd2TableTd1】命令，把样式应用到这些单元格上。 9.在第1行的4个单元格中分别插入图像“images/1.jpg”、“images/2.jpg”、“images/3.jpg”和“images/4.jpg”。 10.运用同样的方法设置表格第2行第1个单元格的ID为“MidTd2TableTd2”，并在“css.css”中创建【高级】CSS样式“#MidTd2TableTd2”，在【类型】分类中设置文本大小为“16像素”，文本粗细为“粗体”，行高为“30像素”，在【背景】分类中设置背景颜色为“#00CCCC”，在【区块】分类中设置文本对齐方式为“居中”，最后把第2行的其他单元格的ID也设置为“MidTd2TableTd2” 11.在第2行的4个单元格中依次输入文本，如图所示。 任务三 设置页脚的CSS样式 【操作步骤】 1.在主体页面表格的下面，即页脚处插入一个1行1列的表格，表格ID为“FootTable”，填充、间距和边框均为“0”。 2.在“css.css”中创建高级CSS样式“#FootTable”，在【类型】分类中设置大小为“14像素”、“粗体”、行高为“40像素”，在【背景】分类中设置背景颜色为“#00CCFF”，在【区块】分类中设置文本对齐方式为“居中”，在【方框】分类中设置方框宽度为“800像素”。 3.最后输入相应的文本，如图所示。 4.最后再次保存文件 徐水职教中心 陈全 设置海洋知识网页样式 设置页眉CSS样式 任务一 设置网页主体的CSS样式 任务二 设置页脚的CSS样式 任务三 任务一 设置页眉CSS样式 （一） 定义“body”的CSS样式 【操作步骤】 1.首先在Dreamweaver 8中定义一个本地静态站点，然后把“项目素材”文件夹中的内容复制到站点根文件夹下。 2.在网站根文件夹下面新建一个网页文档并保存为“xm8.htm”。 3.在菜单栏中选择【窗口】／【CSS样式】命令，即在【CSS样式】命令前打上“√”，打开【CSS样式】面板，如图所示。 4.在【CSS样式】面板中单击面板底部的按钮，在弹出的【新建CSS规则】对话框的【选择器类型】选项组中，点选【标签（重新定义特定标签的外观）】单选钮，在【标签】下拉列表中选择【body】选项，在【定义在】选项组中点选【仅对该文档】单选钮，如图所示。 5.单击按钮，进入【body的CSS规则定义】对话框，在【类型】分类中设置文本大小为“14像素”，如图所示 。 6.切换到【区块】分类，在【文本对齐】下拉列表中选择【居中】选项，如图所示。 7.切换到【方框】分类，在【边界】选项中勾选【全部相同】复选框。然后在【上】文本框中输入“0”，如图所示。 【操作步骤】 1.在网页中插入一个1行2列的表格，在【属性】面板中设置表格Id为“TopTable”，表格的填充、间距和边框均为“0”。 2.