Dreamweaver ,CS3网页设计案例教程 教学配套课件 王春红 王瑾瑜主编 模块六 层时间轴框架.pdfVIP

模块五使用层\ 时间轴和框架 任务一 初识并使用层 任务二 使用时间轴 任务三 框架使用 学材小结 任务一 初识并使用层 子任务1 创建层 层（Div）是一种网页元素定位技术，使用层可以以像素为单位精确定 位页面元素。层的位置比较随意可以放到网页的任意位置 创建层可以使用以下3种方法中的任何一种： 执行【插入记录】→【布局对象】→【AP div 】命令 单击【插入】工具栏的“布局”面板上的【绘制层】按钮，如图6-3所示。 鼠标左键按住此按钮把层按钮拖到文档窗口里。如图6-6所示。 单击【插入】工具栏的“布局”面板上的【绘制层】按钮，如图6-3所示。 在文档窗口中拖动鼠标绘制一个层。 任务一 初识并使用层 子任务2 层的基本操作 • 在Dreamweaver CS3 中可以在网页中随意插入层，但是插入层后通 常还不能完全达到设计者的要求，还需要对其进行修改调整、移动、 对齐、隐藏等操作。 • 层的基本操作： • 选择层 • 调整层的大小 • 移动层 • 对齐层 • 在层中插入文本内容或者图像 • 嵌套层 任务一 初识并使用层 子任务2 层的基本操作 • 层的基本操作： • 选择层的四种方法： • 1、 将光标移动到需要选择的层边框上，当光标指针变成“十字双向箭 头”光标时，单击鼠标左键即可选中该层。如图6-7所示。 • 2、直接单击层的内部，当出现显示层的选择柄图标时，如图6-8所示 。接下来单击文档窗口左下角状态栏里的“div#layer1”层标签，也可 选择层。如图6-9所示。 • 3、 直接单击文档窗口中的层标记符 ，即可选中该层，如图6-10所示 • 4 、在“层”面板中选择层的名称，即可选择层。“层”面板如图6-12所示 。选择多层时，可按住Shift键，点选要选择的层的名称即可。 任务一 初识并使用层 子任务2 层的基本操作 • 层的基本操作： • 选择层的四种方法： • 1、 将光标移动到需要选择的层边框上，当光标指针变成“十字双向箭 头”光标时，单击鼠标左键即可选中该层。如图6-7所示。 • 2、直接单击层的内部，当出现显示层的选择柄图标时，如图6-8所示 。接下来单击文档窗口左下角状态栏里的“div#layer1”层标签，也可 选择层。如图6-9所示。 • 3、 直接单击文档窗口中的层标记符 ，即可选中该层，如图6-10所示 • 4 、在“层”面板中选择层的名称，即可选择层。“层”面板如图6-12所示 。选择多层时，可按住Shift键，点选要选择的层的名称即可。 任务一 初识并使用层 子任务2 层的基本操作 • 层的基本操作： • 调整层的大小 • 移动层 • 对齐层 • 在层中插入文本内容或者图像 • 嵌套层 任务一 初识并使用层 子任务3 设置层属性 • 在层“属性”面板中，查看和设置层的属性，只要选择一个层，执行【 窗口】→【属性】命令，就会打开如图6-19所示的“属性”面板， 任务一 初识并使用层 • 层“属性” 子任务3 设置层属性（层可见案例） • 层编号：在其右边的下拉列表中，可以指定一个名称来标识层，在文本框中可以输入层 名。层名只能使用英文字母和数字，不能使用特殊字符。 • 左