DW教程--五、使用CSS美化页面名师精编资料汇编.pdfVIP

第五节 使用 CSS美化页面 层叠样式表 (CSS) 是一系列格式设置规则， 它们控制 Web 页面内容的外观。 使用 CSS 设置页面格式时，内容与表现形式是相互分开的。页面内容（ HTML 代码）位于自身的 HTML 文件中， 而定义代码表现形式的 CSS 规则位于另一 个文件（外部样式表）或 HTML 文档的另一部分（通常为 head 部分）中。 使用 CSS 可以非常灵活并更好地控制页面的外观， 从精确的布局定位到特定 的字体和样式等。 术语“层叠”是指对同一个元素或 Web 页面应用多个样式的能力。 例如， 可 以创建一个 CSS 规则来应用颜色， 创建另一个规则来应用边距， 然后将两者 应用于一个页面中的同一文本。 所定义的样式“层叠”到您的 Web 页面上的 元素，并最终创建您想要的设计。 CSS样式表的创建，可以统一定制网页文字的大小、字体、颜色、边框、链 接状态等效果。在 Dreamweaver 8 中 CSS样式的设置方式有了很大的改进， 更为方便、实用、快捷。 一、创建 CSS样式 1 、选中菜单“窗口” “CSS样式”。打开 CSS样式面板。 2、单击“ CSS样式”面板右下角的“新建 CSS规则”按钮，打开“新建 CSS 规则”对话框。 在“选择器类型”选项中，可以选择创建 CSS样式的方法包括以下三种： 类：我们可以在文档窗口的任何区域或文本中应用类样式， 如果将类 样式应用于一整段文字，那么会在相应的标签中出现 CLASS属性，该属性值 即为类样式的名称。 标签（重新定义特定标签的外观）：重新定义 HTML标记的的默认格 式。我们可以针对某一个标签来定义层叠样式表，也就是说定义的层叠样式 表将只应用于选择的标签。 例如，我们为 body和 /body 标签定义了层叠样 式表，那么所有包含在 body和 /body 标签的内容将遵循定义的层叠样式 表。 高级（ ID、伪类选择器等）：为特定的组合标签定义层叠样式表，使 用 ID 作为属性， 以保证文档具有唯一可用的值。 高级样式是一种特殊类型的 样式，常用的有 4 种： a:link 设定正常状态下链接文字的样式。 a:active 设定鼠标单击时链接的外观。 a:visited 设定访问过的链接的外观。 a:hover 设定鼠标放置在链接文字之上时，文字的外观。 3 、为新建 CSS样式输入或选择名称、标记或选择器，其中： 对于自定义样式，其名称必须以点（ . ）开始，如果没有输入该点， 则 DW回自动添加上。自定义样式名可以是字母与数字的组合，但 . 之后必须 是字母。 对于重新定义 HTML标记，可以在“标签”下拉列表中输入或选择重 新定义的标记。 对于 CSS选择器样式， 可以在“选择器”下拉列表中输入或选择需要 的选择器。 4 、在“定义在”区域选择定义的样式位置，可以是“新建样式表文 件”或“仅对该文档”。 单击“确定”按钮， 如果选择了“新建样式表文件” 选项，回弹出“保存样式表文件为”对话框，给样式表命名，保存后，回弹 出“CSS规则定义”对话框。如果选择