《(刘桂江)网页制作之第5章CSS样式与模板的使用》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、网页设计与制作第一章HTML语言基础第二章初识Dreamweaver第三章创建与应用表格第四章使用层和框架布局页面第五章CSS样式与模板的使用第六章行为和库部件的使用1/12第五章CSS样式与模板的使用一、层叠样式表概述1、什么是CSS层叠样式表(CSS)是一系列格式设置规则，它们控制网页内容的外观。CSS样式规则由两部分组成：选择器和声明。选择器是样式名称(如tr或p)，而声明则用于定义样式元素。声明由属性(如color)和值(如red)两部分组成。如：p{font-size：16px；color：red}2/12第五章CSS样

2、式与模板的使用2、CSS的作用CSS样式主要是实现网页中各种元素的准确定位。CSS样式只需修改一个文件就可以改变一批网页的外观和格式，使用户设计的网站拥有更少的代码和更快的下载速度。二、CSS样式的创建与应用1、“CSS样式”面板窗口/CSS样式2、创建CSS样式格式/CSS样式/新建3/12第五章CSS样式与模板的使用3、应用类样式类样式是惟一可以应用于文档中任何文本(与控制文本的标签无关)的CSS样式类型。1）应用自定义的CSS样式属性面板的“样式”下拉列表框2）删除自定义的CSS样式“样式”下拉列表框中选择“无”4/12第五

3、章CSS样式与模板的使用三、CSS样式的导出与编辑1、导出样式以创建CSS样式表用户可以从文档中导出样式以创建新的CSS样式表文件。然后，再链接到其他文档以应用这些样式。“CSS样式”面板右击/移动CSS规则2、链接和导入外部样式表可以导入或链接到外部样式表以应用那里包含的样式。格式/CSS样式/附加样式表5/12第五章CSS样式与模板的使用3、管理CSS样式“CSS样式面板”中快捷菜单改名、编辑、删除对文档内的CSS样式进行编辑时，会立刻重新设置该CSS样式控制的所有文本的格式。编辑外部样式表会影响与它链接的所有文档。6/12

4、第五章CSS样式与模板的使用四、CSS样式的优先顺序(1)如果将两种样式应用于同一文本，浏览器显示这两种样式的所有属性。(2)如果应用于同一文本的两种样式的属性发生冲突（如，一种样式可能将蓝色指定为文本颜色，而另一种样式可能指定红色作为文本颜色。），则浏览器显示最里面的样式(离文本本身最近的样式)的属性。7/12第五章CSS样式与模板的使用示例：

举例:该段落受自定义样式.Blue和HTML标签样式h1的控制。但这个句子受.Red样式控制。现

5、在，我们返回到.Blue样式。

6、板中的页9/12第五章CSS样式与模板的使用2）通过模板面板●应用按钮●网页应用此模板后，就不能改变此网页上的任何部件。3.修改模板1）定义模板的可编辑区域①打开要处理的模板②选中一块作为可编辑区域的网页元素③插入/模板对象/可编辑区域10/12第五章CSS样式与模板的使用2）删除可编辑区域的一般步骤①打开要处理的模板②修改/模板/删除模板标记3）定义模板的可选区域●用于设置选定内容是否显示①打开要处理的模板②选中一块作为可选区域的网页元素③插入/模板对象/可选区域●在网页文件中（修改/模板属性）11/12第五章CSS样式与模板的

7、使用4）定义模板的可编辑标签属性●用于修改应用了模板的网页文件的标签属性①打开要处理的模板②选中想要在网页文件中修改标签属性的网页元素（如表格的背景色bgcolor）③修改/模板/令属性可编辑●在网页文件中（修改/模板属性）4.用模板来更新整个站点●修改/模板/更新页面12/12