《网页制作》模块4网页的样式设计分析

目录模块4网页的样式设计目录模块4网页的样式设计认识CSS样式表。掌握引用CSS样式表的方法。掌握CSS样式表的应用方法。知识目标目录模块4网页的样式设计能理解CSS的作用。能恰当地应用CSS样式表修饰页面。能力目标目录模块4网页的样式设计任务1：认识CSS样式表。任务2：使用CSS修饰页面。具体任务目录CSS基础(1)(2)(3)(4)引用CSS样式表CSS规则CSS样式的类型4.1.1任务分析任务1认识CSS样式表目录4.1.2相关知识1.CSS基础通过使用CSS样式设置页面的格式，可将页面的内容与表示形式分离。除设置HTML元素样式外，还可以使用CSS控制Web页面中块级元素的格式和定位。对块级元素进行操作的方法实际上就是使用CSS进行页面布局设置的方法。任务1认识CSS样式表目录2.CSS规则CSS规则由两个主要部分构成，即选择器和一条或多条声明。选择器是需要改变样式的元素，每条声明由一个属性和一个值组成，属性和值之间用冒号分开。任务1认识CSS样式表目录3.CSS样式的类型在Dreamweaver中可以定义以下样式类型任务1认识CSS样式表(1)(2)(3)类样式HTML标签样式高级样式目录4.引用CSS样式表CSS规则可以位于以下位置任务1认识CSS样式表(1)(2)(3)外部CSS样式表内部或嵌入式CSS样式表内联样式目录任务1认识CSS样式表4.1.3任务小结CSS是网页设计中一项很重要的技术，了解CSS的特性、掌握CSS的类型和引用方式是正确使用CSS的基本要求。目录任务2使用CSS修饰页面4.2.1任务分析要能正确、恰当地在页面中运用CSS样式，需要掌握以下内容(2)掌握以下内容(1)(3)创建和管理CSS样式编辑CSS样式应用和删除CSS样式目录4.2.2相关知识1.创建和管理CSS样式任务2使用CSS修饰页面目录任务2使用CSS修饰页面目录任务2使用CSS修饰页面目录2.编辑CSS样式Dreamweaver中提供了8种CSS样式类别，即类型、背景、区块、方框、边框、列表、定位和扩展。类型背景区块方框边框列表定位扩展CSS样式任务2使用CSS修饰页面目录1）“类型”样式任务2使用CSS修饰页面目录下面对“类型”样式下的各个选项进行详细介绍任务2使用CSS修饰页面“类型”样式Font-familyLine-heightFont-sizeText-decorationFont-styleColorFont-weightFont-variantText-transform目录2）“背景”样式任务2使用CSS修饰页面目录下面对“背景”样式下的各个选项进行详细介绍。任务2使用CSS修饰页面背景样式BECDABackground-color（背景颜色)Background-image（背景图像）Background-repeatBackground-position（X）和Background-position（Y）Background-attachment目录3）“区块”样式任务2使用CSS修饰页面目录下面对“区块”样式下的各个选项进行详细介绍任务2使用CSS修饰页面Word-spacing（单词间距）Letter-spacing（字母间距）Vertical-align（垂直对齐）Text-align（文本对齐）Text-indent（文字缩进）White-space（空格）Display（显示）区块样式目录4）“方框”样式任务2使用CSS修饰页面目录下面对“方框”样式下的各个选项进行详细介绍任务2使用CSS修饰页面方框样式BECDAWidth（宽）和Height（高）Float（浮动）Clear（清除）Margin（边距）Padding（填充）目录5）“边框”样式任务2使用CSS修饰页面目录下面对“边框”样式下的各个选项进行详细介绍任务2使用CSS修饰页面(1)(2)(3)Style（类型）Width（宽度）Color（颜色）目录6）“列表”样式任务2使用CSS修饰页面目录下面对“列表”样式下的各个选项进行详细介绍任务2使用CSS修饰页面(1)(2)(3)List-style-typeList-style-imageList-style-Position目录7）“定位”样式任务2使用CSS修饰页面目录下面对“定位”样式下的主要选项进行详细介绍任务2使用CSS修饰页面Placement（放置）Position（位置）Clip（剪辑）Z-Index（Z轴）Overflow（溢出）Visibility（可见性）“定位”样式目录8）“扩展”样式任务2使用CSS修饰页面目录下面对“扩展”样式下的主要选项进行详细介绍任务2使用CSS修饰页面(1)(2)(3)分页Cursor（光标）Filter（过滤器）目录任务2使用CSS修饰页面3.应用和删除CSS样式应用CSS样式删除CSS样式目录4.2.3任务实施任务2使用CSS修饰页面1.具体任务目录任务2使用CSS修饰页面2.实现步骤目录任务2使用CSS修饰页面目录任务2使用CSS修饰页面目录任务2使用CSS修饰页面目录任务2使用CSS修饰页面目录任务2使用CSS修饰页面目录任务2使用CSS修饰页面4.2.4任务小结通过本任务可以练习创建、应用样式规则，创建、链接外部样式表等操作，CSS样式文件作用强大，是网页设计中必不可少的知识，使用外部样式表文件可以极大地提高网页制作效率和质量，应熟练掌握。目录思考与练习1.如果要使一个网站的风格统一并便于更新，在使用CSS时最好使用（）样式。A.内部B.外部C.相对D.嵌入2.下列（）是定义样式表的正确格式。A.{body:color=black(body）}B.body:color=blackC.body{color：black}D.{body;color:black}目录思考与练习1.使用CSS样式表有什么好处？2.观察网络中的优秀页面，学习页面的CSS样式设计，总结CSS样式设计的经验。目录