第十六章 层叠样式模板库及其表单的应用PPT课件

16.3.1 创建和应用库项目 库可以是body中的任何元素，只要成为
了库项目，就可以在多个地方引用。 库项目可以包含行为，但不能包含时间轴
或样式表。 创建库项目主要有两种方式：创建空白库
项目和将选定内容创建为库项目。
16.3.1 创建和应用库项目
1. 创建空白库项目 在“资源”面板中，单击库按钮 ，选择
设置完各属性后，点击确 定即可在CSS面板中的列 表中显示新建的CSS规则， 如果需要对其进行修改， 则在该CSS规则名上双击 即可进行属性设置对话框。
或在其名上单击右键，可 以进行其他编辑操作。
16.1 层叠样式表（CSS）
16.1.3 外部样式表的操作 在CSS面板中单击右下角的“附加样式表”
击右下角的新建按钮 ， 或点击右上角的按钮 ，在
弹出的菜单中选择“新建”命 令又，或选择菜单“文 本”“CSS样式”“新建” 命令。
16.1.2 层叠样式表的创建与编辑
第二步：在弹出的“新建 CSS规则”对话框中进行 相应的设置。
16.1.2 层叠样式表的创建与编辑
16.1.2 层叠样式表的创建与编辑
16.4 资源管理器
资源管理器汇总了本站点内的多媒体文件， 在“资源”面板中可方便的进行管理和编 辑操作。
图像 颜色 链接
Flash动画 Shockwave影片 脚本 模板 库来自16.5 表单及其应用
16.5.1 表单概述 表单可以增加网页的交互性。 获得访问者的用户信息。 表单主要是在客户端，当访问者在表单中
选中库项目，可在相应的属性面板中设置 属性值。
2. 将选定内容创建为库项目
打开库文 件窗口
将当前选择的 内容从库项目
中分离出来
将以前使用库项目 插入的内容重新生
成库项目文件
16.3 库的应用
16.3.2 编辑库项目 在“资源”面板中，双击要编辑的库项目，
或选中要编辑的库项目，再单击面板底部 的“编辑”图标，则打开一个用于编辑该 库项目的新窗口，进行编辑。 也可在文档中，直接选择库项目创建的内 容，双击其进入编辑，或右键单击菜单选 择“编辑”命令，进入库项目编辑。
创建CSS样式表的过程，就是对各种CSS 属性的设置过程，属性分为：类型、背景、 区块、方框、边框、列表、定位、扩展等 八个部分。
在CSS控制面板中进行层叠样式表的编辑 操作。
16.1.1 层叠样式表概述
16.1 层叠样式表（CSS）
16.1.2 层叠样式表的创建与编辑 创建样式表的具体步骤： 第一步：在“CSS”面板中，单
16.1.4 CSS样式表的滤镜应用
16.2 模板的应用
16.2.1 模板概述 设计网站页面时，套用设计好的模板，可
以创建风格一致的页面，还可节省大量的 设计时间。 站点的模板文件保存在本地站点目录下的 Templates文件夹中。 模板文件的扩展名为.dwt。
16.2 模板的应用
16.2.2 创建和保存模板
16.2.2 创建和保存模板
可以通过选择菜单“文件”“另存为模板” 命令，将当前的文档保存为模板，将弹出“另 存模板”对话框。
在对话框中进行相应的设置，点击保存，将模 板文件保存到站点的Templates文件夹中。
16.2 模板的应用
16.2.3 应用与修改模板 可在“资源”面板中，可通过双击模板名
按钮 ，或点击右上角菜单中选择“附 加样式表”命令，则弹出“链接样式表” 对话框，选择外部CSS样式表路径即可。
16.1 层叠样式表（CSS）
16.1.4 CSS样式表的滤镜应用 CSS样式表编辑中提供了多种滤镜效果，
可以在CSS规则定义对话框中的“扩展” 部分进行编辑设置。 大多数CSS滤镜应用于文本时，需要先用 CSS设置一个指定区域。
可通过“插入” 菜单“表单” 的子菜单中选 择要插入页面 表单的类别。
16.5.2 创建表单
2. 创建表单域
首先在页面中插入一个空表 单域，选择菜单“插入” “表单”的子菜单中的 “表单”，则会在页面中看 到一个红色的虚框就是表单 域。
16.5.2 创建表单
输入信息，提交后，这些信息将被发送到 服务器，然后服务器对信息进行处理，将 处理完生成新的Html文件并发送回访问者。
16.5 表单及其应用
16.5.2 创建表单 1. 表单对象简介 表单对象就是表
单输入类型。 是允许用户输入
数据的机制。 可以在表单中添
加的对象如左图。
16.5.2 创建表单
网页设计与网站开发
第十六章 层叠样式、模板、库及 其表单的应用
学习目标
掌握层叠样式表的基本操作及其应用 掌握模板的应用 掌握库的应用 了解资源管理器的基本操作 掌握表单应用操作
16.1 层叠样式表（CSS）
16.1.1 层叠样式表概述
层叠样式表（Cascading Style Sheets）语 言是一系列格式规则。
面板左侧的库。 单击面板底部的“新建库项目”按钮 ，
即被添加到面板的列表中，输入一库名即 可。 Dreamweaver在站点根目录的Library文件 夹中，将每个库文件都保存为一单独的扩 展名为“.lbi”的文件。
16.3.1 创建和应用库项目
2. 将选定内容创建为库项目
在文档窗口中，选择文档中要另存为库项 目的内容，再单击“资源”面板底部的 “新建库项目”按钮，该内容即被创建为 库项目，或直接将选定的内容拖到资源面 板的库类别中也可。
称，或选中要编辑的模板，再单击“编辑 模板”按钮 ，即可在编辑窗口中打开 该模板进行编辑操作。 打开一文档，选中一模板，单击“资源” 面板底部的“应用”按钮，即可应该到该 模板应用到文档中。
16.2.3 应用与修改模板
也可通过菜单 “修改”“模 板” 子菜单中的 命令来编辑文档 中的模板。
16.3 库的应用
在“资源”面板中， 单击左侧的“模板” 按钮 ，打开模板分 类。在面板中将显示 当前站点所有的模板 文件，顶部为所选模 板的预览。
16.2.2 创建和保存模板
单击资源面板底部的 “新建模板”按钮，则 会在资源面板中出现名 为“Untitled”的新模板。
可以通过右键菜单，进 行重命名、删除等操作。