图层(Layer)是HTML内容的容器,通常由<div>或<span>,标签描绘,使用图层可以给页面增加更多的动态控制。
图层的作用在于浏览器窗口中将页面元索精确定位。图层中也可以包含文本、图片、插件甚至嵌套的图层。任何加人HTML文档的元素都可以将其放置在图层中。
而图层重要的功能是可以将页面中的元素重叠,这样可以使用“行为”控制图层的显示与隐藏,并可生成快速载入页面文件。还可以通过“时间轴”使图层移动或随着时间发生变化。下面将学习在Dreamweaver MX 2004中运用图层进行布局。
生成图层的方法有以下三种:
(1)将光标置于文档窗口要插入图层的位置,然后在[插人]菜单中选择[布局对象]的[图层]命令。
(2)选择插入栏的[布局]选项卡。单击面板中的图层按钮,并将其拖入文档窗口,松开鼠标后在光标所在位置将生成个新的图层。
(3)单击[对象]面板中的图层图表,然后松开鼠标,在文档窗口需要插入图层的位置拖动出个图层。
插入图层后,个图层标志会显示在文档窗口的左上方。如果没有看见图层标志,则在[查看]菜单中选择[可视化助理]中的[不可见元素]命令。
当生成图层后,可以调整图层的属性,确定图层的各项显示状态。
图层的[属性]面板说明如下:
[层编号]:在该文本框中指定图层的名字,用于在图层面板中识别图层。图层的名字只能使用标准的文字与数字字符,不能使用特殊字符,如空格、连字号、斜线或句号等。
[左]与[上]:在这两个文本框中指定于页面或父图层左上角的相对位置。
[宽]与[高]:在这两个文本框中指定图层的宽度值与高度值。如果图层中内容的尺寸超过图层的边界,超过部分内容将被自动剪掉。
[Z轴]:在该文本框指定Z轴,即图层的堆栈顺序。高数值的图层显示在低数值图层的上方,这个值可正可负。使用图层面板,可以更轻松的完成对图层堆栈顺序的修改。
[可见性]:该下拉列表用于初始化图层的显示情况。可使用脚本语言,如JavaScript,来控制可见性及动态显示图层中的内容。
[背景图像]:在该文本框中指定图层的背景图片,可在文本框内输入图片的路径,或单击文件夹图标浏览并选定个图片文件。
[背景颜色]:在该文本框中指定图层的背景颜色.将其设置为空白是指定透明的背景。
[溢出]:该下拉列表框用于设置CSS图层在其内容超过图层范围时所做出的反应。
[剪辑]:在其包含的文本框定义图层中可以显示的区域。输入的值用于表示以像素为单位的可显示区域图层标界之间的距离。[上]、[下]、[左]、[右]文本框测定的指示可显示区域相对于图层的位置,而不是相对与页面的位置。