Dreamweaver 8中文版网页制作 机房上课版 作者 王正成 第9讲层.pptVIP

2.1．层的选取 设置层属性前要先选中层，常用的层的选择方法有如下几种： 直接在编辑窗口中单击层的边框。 将鼠标光标置于层内，然后在单击标签选择器上的div标签。 单击层上面的图标 ，也可选中层。 执行【窗口】/【层】命令，打开【层】面板，在面板中单击层名称即可选中。 2.2．层的属性设置 选中层之后，就可以在【属性】面板查看和设置层的属性层【属性】面板部分项的说明如下： 【层编号】选项框：设置层名，此名称唯一。 【左】文本框、【上】文本框：设置层相对于编辑窗口或父层左上角的位置。 【宽】文本框、【高】文本框：设置层的大小。 【Z轴】文本框：设置层的层次顺序号。 【可见性】选项框：设置层的可见性，包括“default”（默认）、“inherit”（继承父层的该属性）、“visible”（可见）、“hidden”（隐藏）4个选项。 【类】选项框：添加对CSS样式的引用。 【溢出】选项框：（仅用于CSS层）指的是层的内容过大时如何处理。“visible”：增加尺寸以显示去不内容；“hidden”：只能显示层以内的内容；“scroll”：增加滚动条，无论内容是否超出；“auto”：只有内容超出时才增加滚动条。 【剪辑】：用来指定层的哪一部分内容是可见的，“左”、“右”、“上”、“下”输入的数值是距离层的4个边界的像素值。 2.3．移动层 移动层：移动鼠标光标到层的边框上，待鼠标光标变成 状时，按住鼠标左键不放，拖动层，到达目的后放开鼠标即可 。 2.4．多个层操作 多个层操作：按住Shift键，然后依次单击选中三个层 ，将它们同时选中，执行【修改】/【排列顺序】/【左对齐】等命令 ，如图所示。 3.1． 隐藏与显示 层的隐藏与显示可以通过【层】面板上的眼形 列来设定，在眼形图标所在的列中，单击层名的前部，单击一次鼠标，就改变一种状态。当层名前的图标为 时，表示该层处于隐藏状态；当层名前的图标为 时，表示该层处于显示状态；如果层名前没有任何图标，表示该层处于浏览器默认状态或者继承其父层的可见性。 设置层的显示/隐藏状态在未设置层的显示状态前，层名前面不显示任何图标，即采用默认的显示状态。单击一次，显示 ，表示隐藏，再单击一个，显示 ，表示显示，再单击一次，图标消失，回到默认状态 。 3.2． 层的堆叠 在【层】面板中可以直接拖动某层到新的位置，从而改变层的堆叠次序，如图所示 3.3． 与表格的相互转化 文档中先选中层，然后执行【修改】/【转换】/【层到表格】 ，可以将层转化为表格。 选中整个表格，执行【修改】/【转换】/【表格到层】命令 ，可以将表格转化为多个层。 Dreamweaver 8 中文版网页制作基础 主讲人 在线教务辅导网： 教材其余课件及动画素材请查阅在线教务辅导网 QQ:349134187 或者直接输入下面地址： 第九讲 层的使用 1、层的基本知识 2、层的属性设置 3、层的高级应用 1、层的基本知识 1．层的概念 2．插入层 3．绘制层 4．嵌套层 1.1. 层的概念 什么是层？层是一个被准确定位的HTML网页元素，它和文字、图像等一样都是网页的组成部分；层也是一个网页内容的容器，可以在层中放入任何页面元素；同时层也可以层叠和叠加。 利用层可以控制网页元素的位置，可以实现网页对象的重叠和立体化等动态效果，使网页内容变得更加丰富。 1.2．插入层 在【插入】菜单栏执行【插入】/【布局对象】/【层】命令，即可在页面中插入一个默认的层，如图所示 。 用菜单命令插入的层，采用的是程序默认的设置，宽是200像素，高115像素。 1.3．绘制层 将【常用】插入栏切换到【布局】插入栏 ，单击绘制层按钮 ，移动鼠标光标到编辑窗口，待鼠标光标变成十字状，按住鼠标左键拖拉出一个160×70像素的层，如图所示。放开鼠标即可完成，用这个方法插入的层可以控制大小 。 层的大小 1.4．嵌套层 嵌套是将一个层包含在另一个层中。嵌套层通常用于层的叠加和组织，并且子层可随父层一起移动，可继承父层的一些属性。 首先在编辑窗口插入一个层 ，将鼠标光标置于父层内，再执行【插入】/【布局对象】/【层】命令插入一个子层，这就是嵌套层，如图所示。 子层 父层 2、 层的基本属性 2.1 层的选取 2.2 层的属性设置 2.3 移动层 2.4 多个层操作 3、 层的高级应用 3.1 隐藏与显