第二页: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的背景色,这种颜色就确实出现在InternetExplorer
中。但是在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天]