第二页：DIV和Layer

　　创建dHTML页面以DIV开始。可以从Objects工具条的Common集合中插入DIV。点击图标插入DIV。不是出现标准对话框，而是光标弹出选取框
一样的图标。用它在页面上画一个矩形 - 此黑体矩形有抓取器和一个小操作图标。

　　Properties工具条将显示关于Layer的信息。 注意当Dreamweaver讲到Layer时，不一定意味着<LAYER>tag。 Dreamweaver把所有有绝对位置的元素当作Layer，然后给那个对象一个小抓取器。在知道是否超越DIV和SPAN之前尝试跨平台的dHTML是自找麻烦。为了解决这个问题，一些
Dreamweaver的特征 - 如Timeline - 决定页面中命名Layer的表现。Dreamweaver把<DIV>、<SPAN>、<LAYER>和<ILAYER>当作有效的Layer对象，你可以选择在Preferences(Layer之下)中使用哪个tag。要在Layer中插入HTML，可以在Layer内点击，如同在document中一样。

　　要编辑Layer，可以点击它的抓取器。这会引起Properties工具条的Layer UI。从那儿，你可以设置Layer的样式属性 - 可以在Netscape和Internet Explorer两种方式下工作。第一种属性被缺省设置：你插入到文档中的Layer号标记给ID。你可以用一个更容易记忆的名字代替。（但是要小心！如果使用JavaScript中的保留名，如“this”，会使Dreamweaver和你的浏览器疯掉。）这个名字会出现在涉及这个Layer的所有界面中。Properties工具条的其它属性允许你定位Layer和修改它的大小。

　　这是dHTML的“安全”区。这些属性可以用在DIV和CSS上 - 可以用JavaScript描述它的left、top、z-index和visibility属性。如果你读过我的dHTML教程，你会知道这只是一项杂务。

　　要改变Layer的位置和大小，可以设置工具条中的坐标或使用抓取器。可以用Layer边界上的改变Layer的大小。其它两个安全的、可写脚本的技术也可通过Layers工具条实现。从Window菜单，选择Layers（或按F11键）。

　　此工具条使你容易地存取Layers - 只需点击它们的名字。你可能会注意到每次插入一个Layer时，文档上就会出现一个小的黄色的“invisibles”图标。这些图标允许你选择屏幕上不可见的元素。然而，我发现这些图标在文档流程上占用了太多的空间，所以我通常把它们关掉：选择View菜单的Invisible Elements，或按C-Shift-I。把所有的Layer选择操作留给Layer工具条。任何被选择的Layer变为可见，并且出现在z-index的顶部。

　　Layer工具条上的工具有一些问题。例如，在Dreamweaver中设置Layer的背景色，这种颜色就确实出现在Internet Explorer中。但是在
Netscape中，颜色只出现在Layer中的文本或图像的背后。

Layer in Dreamweaver	Layer in Internet Explorer 4.0	Layer in Netscape 4.0

　　Dreamweaver非常坚持Web标准。它在写HTML和CSS 时严格遵守其标准。但是不是所有的浏览器完全支持CSS。即使这样，你也可以设置元素的背景色 - 它是有效的CSS，你得到的是上面所示的无效渲染的图像。为了解决这个问题，必须实现非标准的CSS。Netscape 4.0用一个layer-background-color样式规则来实际填充Layer的颜色。不幸的是，Dreamweaver 1.2没有这样工具的界面，你只好在文本窗口或用文本编
辑器自己修改了。

　　你会再一次注意到背景色的问题并没有被解决。背景色只跨越最长文本行或图像的宽度。解决这个问题要用到样式表 - 幸运的是，Dreamweaver有这样的工具界面。

　　通过Window菜单调用Style工具条（或者按F7，或者点击任何launcher上的图标）。下面让我们看看Dreamweaver的样式表功能。 >>

　　第一页 Dreamweaver简介 - 第二天
　　第二页 DIV和Layer
　　第三页 样式表

　　[ 第1天 ][第2天][ 第3天 ]

茶博士 和 纸老虎
©矫龙网络 版权所有