搜索
项目五应用CSS样式任务一样式表的基本应用任务二样式表的高级应用任务一样式表的基本应用任务说明使用CSS样式表可以为网页中的行、标题或单元格等标签定义样式，也可以为链接文本定义样式，还可以定义可应用于任何元素的样式，从而快速设置或更新网页的外观。在DreamweaverCS5中，我们可以使用两种方式创建CSS样式表，一种是利用“CSS样式”面板，在可视化的操作环境中进行创建；一种是在“代码”视图中直接编写相关的代码。本书我们主要学习利用“CSS样式”面板创建CSS样式表的操作。预备知识一、“CSS样式”面板使用“CSS样式”面板可以非常方便地新建、删除、编辑和应用样式，以及附加外部样式表等。选择“窗口”“CSS样式”菜单，可打开“CSS样式”面板。二、创建CSS样式下面我们学习创建CSS样式的方法，并在创建过程中了解CSS样式的类型及存在方式。任务实施一、为“欧妮雅”网站主页设置标签样式下面为“欧妮雅”网站主页创建一个“body”标签样式，并设置该样式的类型和方框属性（具体操作见视频5-1-1）。二、为“欧妮雅”网站主页设置类样式（上）下面创建一个类样式，并设置该样式的类型和列表属性，然后将创建的样式应用于“欧妮雅”网站主页中的列表文本（具体操作见视频5-1-2）。三、为“欧妮雅”网站主页设置类样式（下）下面创建一个类样式，并设置该样式的边框属性，然后将创建的样式应用于“欧妮雅”网站主页中的相应单元格中，从而为各栏目制作分界线（具体操作见视频5-1-3）。四、为“欧妮雅”网站主页设置复合样式（上）默认情况下，网页中的链接文本为蓝色且有下划线，下面为“欧妮雅”网站主页创建复合样式，并设置样式的“类型”属性，使该样式的链接文本在默认状态下为白色，而在鼠标经过时为浅紫色（具体操作见视频5-1-4）。五、为“欧妮雅”网站主页设置复合样式（下）为了将“欧妮雅”网站主页文本右侧的日期与文本区分开来，可为日期设置不同于文本的超链接样式。下面通过为日期设置超链接样式，来看看如何在同一个网页中设置两种超链接样式（具体操作见视频5-1-5）。任务二样式表的高级应用任务说明任务一学习了样式表的基本应用，下面学习将定义好的样式文件链接至网站中其他网页的方法，以及CSS滤镜的应用。预备知识一、附加外部样式一般在制作网站时，为保证同一网站中所有网页风格的一致性，可以将共用的样式保存在外部样式表文件中，然后将其链接至各个网页文档。这不仅大大减少了工作量，还方便了后期的维护和更新。下面我们就来学习如何将外部样式表文件链接至网页文档中。二、CSS滤镜简介应用CSS滤镜可为图像设置渐变、透明、阴影等效果。在“***的CSS规则定义”对话框左侧的“分类”列表中选择“扩展”选项，右侧的“过滤器（Filter）”下拉列表中提供了多种滤镜效果。任务实施——为“欧妮雅”网站子页附加外部样式在学习了附加外部样式的方法后，就可以非常方便地为网站中的其他页面设置样式了。下面通过为“欧妮雅”网站子页设置样式，来巩固前面所学（具体操作见视频5-2）。