《网页制作》模块4网页的样式设计.pptVIP

下面对“扩展”样式下的主要选项进行详细介绍 任务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=black C.body{color：black} D.{body;color:black} 思考与练习 1.使用CSS样式表有什么好处？ 2.观察网络中的优秀页面，学习页面的CSS样式设计，总结CSS样式设计的经验。 目录 目录 模块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-family Line-height Font-size Text-decoration Font-style Color Font-weight Font-variant Text-transform 2）“背景”样式 任务2 使用CSS修饰页面 下面对“背景”样式下的各个选项进行详细介绍。 任务2 使用CSS修饰页面 背景样式 B E C D A Background-color（背景颜色) Background-image（背景图像） Background-repeat Background-position（X）和Background-position（Y） Background-attachment 3）“区块”