Dreamweaver MX 2004从零开始(4)

⊕ 网站首页 ⊕注册会员 ⊕ 本站免费电影 ⊕ 留言板 ⊕ 繁體中文

您现在的位置：陈鹏个人网站 >> 电脑应用 >> 网络应用 >> 网页制作 >> 正文

专题栏目

最新热门

最新推荐

相关文章

图解Firefox 3.1版的私密
 FireFox 3.0的新书签程序
 PPS网络电视（PPStream）
Mozilla FireFox 3.5.1中
 Mozilla FireFox V3.5 正
 DirectShow漏洞来了 Z武
 百无一用的一些雷人Fire
eMule Xtreme V7.2 fina
Webware100 傲游浏览器再
 系统优化和隐私保护工具

Dreamweaver MX 2004从零开始(4)

Dreamweaver MX 2004从零开始(4)

作者：陈鹏文章来源：eNet 点击数：更新时间：2009-9-12 9:00:20

图层的使用

　　创建图层

　　为了说明图层的功能，我们先来制作图1所示的简单的实例效果（如图1）。

　　第一步在Dreamweaver MX 2004中新建一个页面，运行“Insert→Layer Objects→Layer”命令，此时编辑窗口中会出现一个黑色矩形框，这就是插入的图层。当鼠标移动到矩形的框线上时，鼠标会变成十字箭头形状，此时点击鼠标则框线周围出现8个黑色实心方块，左上角还有一个空心方块，表示这个图层被选中了。

　　提示：用鼠标拖拽实心方块可以改变图层大小，拖拽左上角的空心方块可以改变图层的位置。

　　第二步在图层中点击一下鼠标，并且在其中输入“中国电脑教育报”，然后在属性面板窗口中将文字设置为蓝色。

　　第三步单击图层边框选中图层，接着运行“Edit→Copy”命令复制当前图层，然后在编辑窗口其它空白处点击一下鼠标，并且运行“Edit→Paste”命令，这样在编辑窗口中就又出现了一个图层，不过目前它们重叠在一起，需要移动图层之后才能看见这两个图层。

　　第四步把其中一个图层的文字颜色更改为黑色，并且移动图层位置，使得两个图层的位置相差几个像素，这样就产生了阴影效果（如图2）。

请添加描述

完成上述操作之后按下“F12”按键进行预览，就可以在IE浏览器中查看到图1所示的效果了。

　　嵌套图层

　　所谓嵌套图层指的是一个图层创建在另外一个图层中，比如图3所示的就是一个典型的嵌套图层（如图3）。实际上制作这种嵌套图层很简单，只要创建了一个父图层之后用鼠标点击图层内部，并且再次插入一个图层即可。不过嵌套的图层并不意味着子图层必须要在父图层内部，它们之间存在着继承关系。

请添加描述

　　继承的作用是可以使子图层的可见性和父图层保持一致，由于很多动态网页的特效是通过控制图层的可见性来实现的，因此当父图层可见性改变时，子图层的可见性也随之改变。而且继承关系也可以让子图层和父图层的相对位置不变，比如我们拖拽父图层移动，此时子图层也会跟随着移动，这在制作动态网页的时候将显得非常有用。

　　图层的“Z－顺序”

　　和表格相比，图层最大的优势在于图层可以重叠，为了表示各个图层哪个在上面，哪个在下面，就要给每个图层设定一个序号，这个序号就是“Z-顺序”，它的意思就是除了屏幕的X和Y坐标之外，人为增加一个垂直于屏幕的Z轴。

　　如图4所示，左边区域的四个图层和右边区域的四个图层就有明显的不同，而调整图层的顺序也很简单，只要用鼠标依次点选放置在最下部、中部和最上部的图层即可。但是这种操作方式在图层很多的时候就显得有些麻烦了，后期调整也不便，因此我们可以通过图层面板进行调整。

请添加描述

　　先运行“Window→Layers”命令激活图层面板，此时可以看见图5所示的面板窗口（如图5），在这里只要选中需要改变序号的图层，按下鼠标之后向上或者向下拖拽，当拖拽到希望插入的两层之间出现一条横线时松开鼠标，这样就可以改变各个图层的“Z-顺序”了。

请添加描述

　　提示：直接单击“Z”框的数值可以更改为所需要的图层层次。

文章录入：陈鹏责任编辑：陈鹏

上一篇文章： Dreamweaver MX 2004从零开始(3)

下一篇文章： Dreamweaver MX 2004从零开始(5)

【字体：小大】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】