层的基本概念.pptVIP

3.10 层的基本概念 层是一种网页元素定位技术，是DMX中最有价值的对象之一，由层叠样式表发展而来，它提供了一种对网页的对象进行有效控制的手段，HTML正文部分放置的元素，都可以放入层中。 层具有如下优点 精确定位 插入自如 加速浏览 可折叠性 工具栏及菜单命令介绍 层属性面板 层的管理面板 层的操作 设置默认层参数 菜单“编辑”、“首选参数” 选择分类中的“层” 设置具体参数 层的插入 使用层制作“下拉菜单” DMX中的层是指用DIV和SPAN标签描述的HTML内容的容器。可以使用插入、拖动等方法创建层或嵌套层。创建复杂页面布局，可以使用层来布局页面。层被插入到网页后，可以进行选择、移动、调整大小、嵌套及删除等操作。 现通过制作一个下拉菜单实例对层的使用加以说明。 3.10.1 创建层 新建一个文档。输入网页标题“下拉菜单”，在文档窗口输入文本“下拉菜单的制作”，设置文本的属性、设置网页的背景等，保存。 使用菜单【插入】、【布局对象】、【层】，插入一个层（该层自动命名为Layer1）。通过层属性面板，设置左（31px）；上（70px）；宽（230px）；高（35px）；Z轴（2）；背景颜色（黄色）等。 创建层 除了插入单个层，还可以插入嵌套层 直接创建嵌套层。在插入一个层之后，将光标放置在该层（父层）内，再创建新的层（子层）。 将已有的多个层变为子层。使用菜单【窗口】、【层】，打开层浮动面板，选择要作为子层的层。按住Ctrl键，将该层拖动到父层，释放鼠标。 3.10.2 在层中插入对象 将光标置于layer1内，插入一个1行2列、边框为0、宽度为100％的表格。 在两个单元格中分别输入“风景图像”、“动物图像”，作为菜单项。设置文本的格式。 3.10.3 选择和移动层 在文档窗口中插入一个新的层，命名为Layer2，在该层中先按回车插入一空行，再输入“风景1”、 “风景2”、 “风景3”，3行内容并居中。设置Z轴（1）、背景颜色。 选择层。单击层的边框或层浮动面板中的名称，使用Shift键可以选择多个层。 选择Layer2层，调整大小，移动到Layer1层“风景图像”的下面。移动方法 拖动边框；拖动选择手柄；调整属性值 3.10.4 复制层和调整层大小 选择层Layer2，复制、粘贴，将名称改为Layer3，其中的“风景”改为“动物”。 在层被复制时，层内的内容将一起复制。 调整大小 使用鼠标拖动的方式调整层的大小 使用属性栏 3.10.5 对齐层 在文档中连续插入6个层，分别命名为scenery1－3和animal1－3，并在这6个层中各插入一幅图像， 分别选择6个层，调整成一样的大小。选择6个层，执行菜单【修改】、【对齐】中的命令。 3.10.6 隐藏层 隐藏层 使用属性面板的“可见性” 在层标志上点击右键，选择“可见性” 使用层浮动面板中的“眼睛”按钮 在“行为”中隐藏层 选择菜单【窗口】、【行为】 单击窗口状态栏的body标签，选择页面中所有对象，点击【行为】面板中“＋”按钮，选择【显示－隐藏层】命令。在弹出的对话框中，设置除Layer1层外均为隐藏。此时触发动作的事件为“onLoad”。 3.10.7 为创建的层添加行为 把鼠标放在“风景图像”菜单项所在的单元格内，单击【行为】面板上的“＋”按钮，从弹出的菜单中选择【显示－隐藏层】命令，在对话框中设置：Layer1层、Layer2层为显示；Layer3层为隐藏；其它层不进行设置。（如果【行为】面板的行为不能选择，单击“＋”按钮，在弹出的【显示事件】子菜单中更改选项IE4.0或更高版本） 为创建好的层加入行为 确定，关闭对话框，在行为面板中出现触发该动作的onMouseOver事件 设置“风景图像”下拉菜单的显示层。选中Layer2中的全部内容，设置onMouseOver事件，Layer1、Layer2为显示，Layer3为隐藏。再次单击“＋”按钮，设置【显示－隐藏层】，Layer2为隐藏，并修改事件为onMouseOut。 为创建好的层加入行为 同样设置“动物图像”菜单项 同样设置“动物图像”下拉菜单的显示层。 设置子菜单显示的层。在6个子菜单中都使用了两个事件：onMouseOver事件中只设置对应的一个层显示；onMouseOut事件中只设置一个层的隐藏。 为创建好的层加入行为 将光标置于菜单项的上边或左边，在状态栏中选择p标识符，然后从【行为面板】中添加一个onMouseOver事件，设置Layer2、Layer3为隐藏。（该操作的目的是在光标移到菜单的上方或旁边时，菜单消失） 保存文件 预览 3.10.8 使用层的技巧 将层转换成表格 使用层能够更方便、精确地将网页内容定位，进行复杂的网页设计。但有的浏览器不支持层的使用，在设计网页时可以先使用层，创