解析Dreamweaver中的层应用

开篇：润墨网以专业的文秘视角，为您筛选了一篇解析Dreamweaver中的层应用范文，如需获取更多写作素材，在线客服老师一对一协助。欢迎您的阅读与分享！

摘 要： 在使用dreamweaver制作网站时候，总要用到层，因为层是一种网页元素定位技术，使用层可以以像素为单位精确定位页面元素，层可以放置在页面的任意位置。利用层可以非常灵活地放置网站内容，可以再层里面放置文本，图像、视频等对象，甚至是其它的嵌套层。层对于制作网站的部分重叠效果更具有特殊作用，把页面元素放入层中，而已控制元素的显示顺序，也能控制是哪个显示、哪个隐藏。使网站制作工作更加高效。

关键词： Dreamweave；层；编辑；属性

在Dreamweaver中层几乎是个容器可以在里面插入图像、文本、动画等各种网页元素。对于层的编辑有很种方法：首先是层的创建：1）是创建普通的层：可以使用插入、拖放或者绘制技术创建层，在使用“绘制层”工具绘制层时，Dreamweaver会在文档中插入div标签，并为层分配id值（默认情况下，Layer1表示绘制的第一层，Layer2表示绘制的第二层，依此类推）。稍后，可以使用“层”面板或“属性”检查器将层重新命名为想要的任何名称。Dreamweaver还使用文档头中的嵌入式CSS来定位层和确定层的确切尺寸。一旦层被创建，则可以使用层工具栏选中它，将它嵌入到其它层中或改变叠放顺序。2）创建嵌入式层：嵌入式层是指在其它层中创建的层，也就是当光标移动到层中时，在插入其他的层，嵌入式层和被嵌入的层可以一起被移动，并且可继续嵌入其它的层。要分离嵌入式层时，可按住ctrl健，在层面板中选择一层，拖它出目标层即可，但还需注意几点：① 嵌入式层并不一定是页面上的一层位于另一层内。嵌入式层的本质应该是一层的html代码嵌套在另一层的html代码中。（如果它们的html代码互补包含，它们就不是嵌入式层）如果要嵌套层，少用多层父层，应共享一个共同的单一父层。尽量将文本放在层中的一个表格里，并且表格应该是绝对大小的（以像素为单位，而不是百分比）且不大于层，不过主表中的嵌套表可以设置为相对的百分比大小。② 还可以使用另外两种标签来创建层：layer和ilayer。但是，只有Netscape Navigator 4支持这些标签；Internet Explorer不支持这些标签，而Netscape在较新的浏览器中也不再支持这些标签。Dreamweaver可以识别layer和ilayer标签，但不使用这些标签来创建层。

其次是选择层，要对层进行移动，调整大小等编辑操作，选择层，可以选择一层，也可以同时选择多层，可进行对齐层、使他们的宽度和高度相同，或重新定位它们的位置。

在dreamweaver中，要选择一层，有一下几种操作方法：

在文档窗口中单击层的标志，如果层标志不可见，选择“查看”可视化助理“不可见元素”。单击层的选择手柄，如果手柄没有显示，单击层内的任何地方使它显示出来。单击层边界，如果没有活动层，也没有层被选择，在层内按住shift键单击。如果多层被选择，按住ctrl+shift在层内单击。在层面板中单击层的名称。要选择多层，执行以下操作之一：在两层、多层内火边界上按住shift键单击两层 或者多层的名称。插入层对象当光标移动到层内时，就可以插入要插入的对象（元素）。比如插入图层、表单、表格等其它元素。

层的属性设置：

创建复杂的页面布局，使用层是一种选择，把页面元素放入层中，然后拖动层，这样就很容易定位它们，要能正确运用层来设计网页，必须了解层的属性和设置方法，以及层的操作技巧。

单个层的属性：

在文档窗口中创建一个层后，然后选择窗口——属性，打开属性检查器，单击刚建立的层的边线选择它，属性检查器中随即显示层的常用属性，单击属性检查器右下角的扩展箭头，可以看到层的所有属性。

层编号：指定一个名称，标示层面板中的层，在本项下面的文本域中输入层名。层名只能使用英文字母或者数字，不要使用特数表示字符。（如空格 横杠 斜杠、句号等）。

左（L右T）指定层相对于页面或父层左上角的位置，即层的左上角在页面或父层中的坐标，L指定距左边的像素，T指定距顶边的像素。

宽（w）和高（H）：指定层的宽度和高度，如果层的内容超过指定的大小，这些值被覆盖，对于css层，L、T、W、H默认以像素（px）为单位。也可以指定一下单位：pc（十二磅字）、pt（磅）、in（英寸）、mm（毫米）、cm（厘米）或%（父值的百分比）。单位的缩写必须紧跟在值的后面，二者之间没有空格。

Z轴：指定层的索引（或堆叠顺序号）。编号较大的层出现在编号较小的层的上面。编号可正可负，也可以是0。

显示：决定层的初始显示状态。使用脚本语言（如JavaScript）可以控制层的可视性和动态显示层的内容，这个下面有较多选项，分别是：

Default（显示）不指定可视性属性，但多数浏览器把本项解释为inherit（继承）。

Inherit继承父的可视性属性。

visible（可见）显示层的内容，忽略父值。

hidden（隐藏）隐藏层的内容，忽略父值。

背景图片：指定层的背景图像，单击本项右边的浏览图标，可以览并选择一个图像文件，或直接在文本框中输入图像文件的路径。

背景颜色：指定层的背景颜色，此选项为空时指定透明背景。

标签：决定层是css层还是NETcape层。

溢出：仅适用css层，指定如果层的内容超过了它的大小将发生的事件如下：

Visible（可见）增加层的大小，以便层的所有内容都可见，层向下和向右扩展。

Hidden（隐藏）保持层的大小，并裁剪掉与层大小不符的任何内容，不显示滚动条。

Scroll（滚动）：给层添加滚动条，不管内容是否超过了层的大小，特别是通过提供滚动条来避免在动态环境中显示和不显示滚动条导致的混乱。

Auto（自动）在层的内容超过它的边界时自动显示滚动条。

但要注意尽量不要在层中放置滚动条（用overflow属性）。可使用一个DHTML滚动器或Project Seven IFRAME技术来代替。不要给层和一幅图像相同的命名。每个层应该有自己唯一的并区别于页面中其他元素的名字（事实上，不应该让2个具有相同名称的元素出现在同一个页面中）。不要直接对层应用实践/行为，它们将不能跨浏览器工作，应用层中的内容（链接或图像）而不是层自身。

剪辑：定义层的可视区（类似于word中通过设置页边距来定义版心）。在左（左边距）、上（上边距）右（右边距）下（下边距）的文本框中输入一个值来指定距层边界的距离（以像素为单位）。

对于多个层的属性操作时，多个层的属性与单个层属性类似，不同时多个层“属性”面板将显示文本属性和普通（层）属性的子集。按住shift健可选择多层也可一次对多个层进行修改编辑。

总述：在制作网站，要注意层的创建、编辑及各个属性的含义，布局页面时要充分使用层的多种功能以提高建站的工作效率。

参考文献：

[1]王冬英，《精品教程Dreameeaver》8[M].北京科学电子出版社，2009.02.

[2]杨继，《高级案例教程DreamweaverCS》[M].水利水电出版社，2011.08.

[3]文杰书院，《DreamweaverCS5》[M].清华大学出版社，2011.01.