Dreamweaver教程_第8讲_CSS样式表基础.pptVIP

CSS样式表基础 □ 掌握CSS样式的创建及类型 □ 掌握CSS样式的应用 □ CSS样式的概念及类型 □ CSS样式的设置 □ CSS样式的应用 CSS是Cascading Style Sheets(层叠样式表单)的简称。利用它可以对布局、字体、颜色、背景和其它文图效果实现更加精确的控制。而且它不仅可以控制当前文档的格式，还可以控制多个文档的格式。 任务二、创建样式表 □ 类(Class)：自定义样式 注：名称必须以句点开头，包含任何字母和数字组合。如 .style1。如果没有输入句点，Dreamweaver 将自动为您输入。 应用：在对应标记中设置 class=“样式名”。 □ 标签：重新定义HTML标记的格式。 　　注：定义了某个标记，那么，以后只要使用了这个标签就都自动应用这个样式。 □ 高级（选择器）：可为特殊的标记组合或含有ID属性的所有标记定义格式。　　 注：以“＃”，任意字母和数字的组合。 动态链接的4种状态： a:link、a:visited、a:hover和a:active。（正确的顺序是LVHA） 应用：在对应标记中设置 id=“样式名”。 1、背景 我们可以用CSS设置文字背景、表格背景图、页面中静止的背景图片效果 2、区块 主要用来设置对象文本的文字间距、对齐方式、上标、下标、排列方式、首行缩进 3、盒子 可以设置对象的边界、间距、高度、宽度和漂浮方式 4、边框 定义页面中各种边框的样式 5、列表 定义列表项样式、列表项图片和位置。 6、定位 它的作用是将对象放在一个层里来定位，它相当HTML中DIV标记。所以，我们可以用它来设置图片的相对和绝对路径。 7、扩展 本参数可以方便的设置页面打印效果、鼠标指针及CSS特效。 　　为了使样式应用在每一个页面中，我们应用外部样式表，定义一个CSS样式文件。 附加样式表： □ Link（链接）：只读入样式表中的信息，无须将信息转录到当前文档中 □ Import（导入）：将外部CSS样式表中的信息转录到当前文档中。 任务五、实例讲解 结合CSS制作“幽幽天空”首页面 □ 如果两个样式同时应用到同一文本中，则浏览器将显示两个样式中的所有属性，除非两个样式表中有冲突的属性设置。 □ 如果应用到文本中的属性发生了冲突，则浏览器将显示一个最接近文本原始属性的样式。 □ 若有最直接的属性冲突，则来自CSS样式表的属性将优先于来自HTML标签的属性而首先被应用。 　　通过本讲的学习，掌握CSS样式的创建和应用。 1、创建文本样式 2、制作“幽幽天空”首页面 CSS样式表的基本语法 * 第8讲 目的要求 主要内容 任务一、CSS的概述 任务三、 CSS的应用 任务四、外部样式表 任务六、应用样式表时遵循的规律 小结 上机操作 预习