第5章网页制作基础.pptVIP

《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 第5章 网页制作基础 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 主要内容 概述 设计站点 编辑网页 页面布局 建立超链接 使用CSS样式 层、行为和时间轴 模板 管理和发布站点 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6 使用CSS样式 CSS样式概述 创建CSS样式 新建类规则 新建标签规则 新建高级规则 管理CSS样式表 编辑和删除CSS样式表 创建和附加外部样式表 CSS面板快捷菜单 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.1 CSS样式概述 CSS是一系列格式的设置规则，它们用于控制Web页面内容的外观。 CSS规则驻留在另一个文件（外部样式表）或 在HTML 文件的头部中 CSS的优点：便于更新 CSS允许控制HTML无法独自控制的许多属性。 使用CSS控制Web页面中块级别元素的格式和定位。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.1 CSS样式概述 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.1 CSS样式概述 CSS格式设置规则由两部分组成：1. 选择器2. 声明 选择器 H1 { font-size:16 pixels; font-family:Helvetica; font-weight:bold; } 声明 定义元素样式 标识格式元素的术语（如 P、H1、类名或 ID） 介于括号 ({}) 之间 由两部分组成：属性和值 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.1 CSS样式概述 将CSS样式加入网页的方法 从外部附加CSS样式 直接在Dreamweaver中创建CSS样式 使用“CSS样式”面板 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.1 CSS样式概述 “CSS样式”面板 可以创建和管理CSS样式、查看CSS样式的属性。 选中“窗口”/“CSS样式”命令或按Shift+F11键，将打开“CSS样式”面板。 ① ② 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.2 创建CSS样式 ①“文本”/“CSS样式”/“新建” ②单击“CSS样式”面板的“新建CSS规则”按钮 STYLE1 ③CSS面板快捷菜单 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.2 创建CSS样式 新建“类”规则 “类”CSS规则可应用于文档中任何文本 在“新建CSS规则”对话框中，选中“类（可应用于任何标签）”单选按钮，然后在“名称”框中输入名称。类名称是以句点开头、后跟任意字母和数字的字符串。 单击“确定”按钮后，打开“CSS规则定义”对话框，在“CSS规则定义”对话框中选择类别并设置格式。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.2 创建CSS样式 CSS样式举例：alpha－虑镜效果 CSS面板快捷菜单“新建” 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.2 创建CSS样式 新建“标签”规则 重新定义已有的 HTML 标签的格式使使用该标签的元素自动更新格式 下一张 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.2 创建CSS样式 CSS面板快捷菜单“新建” 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.2 创建CSS样式 新建“高级”规则 “高级”CSS规则主要用于设置超链接的格式，包括：一般状态、已访问的状态和鼠标指针指向时的状态等。 设置页面中超链接： 无下划线红色大小12 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.2 创建CSS样式 CSS面板快捷菜单“新建” 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.3 管理CSS样式表 编辑和删除CSS样式表 CSS面板快捷菜单 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.3 管理CSS样式表 创建和附加外部样式表 将CSS样式单独作为一个外部文件保存，创建外部样式表文件 CSS样式嵌入在当前文档中，直接写在head文件头中 下一张 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.3 管理CSS样式表 CSS面板快捷菜单“新建” 定义格式 下一张 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 * 5.6.3 管理CSS样式表 外