1、第8章使用层本章简介：本章简介：如果用户想在网页上实现多个元如果用户想在网页上实现多个元素重叠的效果，可以使用层。素重叠的效果，可以使用层。层是网页中的一个区域，并且层是网页中的一个区域，并且游离在文档之上。利用层可精游离在文档之上。利用层可精确定位和重叠网页元素。通过确定位和重叠网页元素。通过设置不同层的显示或隐藏，还设置不同层的显示或隐藏，还可实现特殊的效果。因此，在可实现特殊的效果。因此，在掌握层技术之后，就可以给网掌握层技术之后，就可以给网页制作提供强大的页面控制能页制作提供强大的页面控制能力。力。课堂学习目标课堂学习目标熟练掌握层的基本操作方法熟练掌握层的基本操作方法掌握应用层设计表
2、格的技巧掌握应用层设计表格的技巧8.1 层的基本操作课堂案例课堂案例联创网络技术网页联创网络技术网页创建层创建层选择层选择层设置层的默认属性设置层的默认属性APAP元素面板元素面板更改层的堆叠顺序更改层的堆叠顺序更改层的可见性更改层的可见性调整层的大小调整层的大小移动层移动层对齐层对齐层层靠齐到网格层靠齐到网格8.1.1课堂案例联创网络技术网页使用绘制“AP Div”按钮绘制层；使用“图像”按钮，插入图像。效果图8.1.2 创建层创建层若想利用层来定位网页元素，先要创建层，再根据需要在层内插入其他表单元素。有时为了布局，还可以显示或隐藏层边框。创建层有以下4种方法。1、单击“插入”面板“布局”
3、选项卡中的“绘制 AP Div”按钮 。此时，在文档窗口中，鼠标指针呈“+”形。按住鼠标左键拖曳，画出一个矩形层。2、将“插入”面板“布局”选项卡中的“绘制AP Div”按钮 拖曳到文档窗口中，松开鼠标，此时，在文档窗口中出现一个矩形层。3、将光标放置到文档窗口中要插入层的位置，选择“插入 布局对象 AP Div”命令，在插入点的位置插入新的矩形层。4、单击“插入”面板“布局”选项卡中的“绘制AP Div”按钮 。此时，在文档窗口中鼠标指针呈“+”形。按住Ctrl键的同时，单击鼠标并拖曳，画出一个矩形层。只要不松开Ctrl键，就可以继续绘制新的层。显示或隐藏层边框若要显示或隐藏层边框，可选择“
4、查看 可视化助理 隐藏所有”命令。8.1.3 选择层选择一个层（1）利用层面板选择一个层。选择“窗口 AP元素”命令，弹出“AP元素”面板。在“AP元素”面板中，单击该层的名称。 （2）在文档窗口中选择一个层，有以下3种方法。单击一个层的边框。按Ctrl+Shift组合键的同时，在要选择的层内部单击。单击一个选择层的选择柄 。如果选择柄 不可见，则可以在该层中的任意位置单击以显示该选择柄。选定多个层选择“窗口 AP元素”命令，弹出“AP元素”面板。在“AP元素”面板中，按住Shift键并单击两个或更多的层名称。 在文档窗口中按住Shift键并单击两个或更多个层的边框内（或边框上）。当选定多个层
5、时，当前层的大小调整柄将以蓝色突出显示，其他层的大小调整柄则以白色显示，并且只能对当前层进行操作。选中图层8.1.4 设置层的默认属性当层插入后，其属性为默认值，如果想查看或修改层的属性，选择“编辑 首选参数”命令，弹出“首选参数”对话框，在左侧的“分类”列表中选择“AP元素”选项，此时，可查看或修改层的默认属性。“首选参数”对话框8.1.5 AP元素面板通过“AP元素”面板可以管理网页文档中的层。选择“窗口 AP元素”命令，弹出“AP元素”面板。 使用“AP元素”面板可以防止层重叠，更改层的可见性，将层嵌套或层叠，以及选择一个或多个层。“AP元素”面板8.1.6 更改层的堆叠顺序排版时常需要
6、控制叠放在一起的不同网页元素的显示顺序，以实现特殊的效果，这可通过修改选定层的“Z轴”属性值实现。层的显示顺序与Z轴值的顺序一致。Z值越大，层的位置越靠上前。在“AP元素”面板中按照堆叠顺序排列层的名称。效果图8.1.7 更改层的可见性当处理文档时，可以使用“AP元素”面板手动设置显示或隐藏层，以便查看层在不同条件下的显示方式。更改层的可见性，有以下几种方法。使用“AP元素”面板更改层的可见性使用“属性”面板更改层的可见性8.1.8 调整层的大小可以调整单个层的大小，也可以同时调整多个层的大小以使它们具有相同的宽度和高度。调整单个层的大小同时调整多个层的大小8.1.9 移动层移动层的操作非常简
7、单，可以按照在大多数图形应用程序中移动对象的相同方法在“设计”视图中移动层。移动一个或多个选定层有以下几种方法。拖曳选择柄来移动层移动一个像素来移动层8.1.10 对齐层使用层对齐命令可以当前层的边框为基准对齐一个或多个层。当对选定层进行对齐时，未选定的子层可能会因为其父层被选定并移动而随之移动。为了避免这种情况，不要使用嵌套层。对齐两个或更多个层有以下几种方法。应用菜单命令对齐层应用“属性”面板对齐层8.1.11 层靠齐到网格在移动网页元素时可以让其自动靠齐到网格，还可以通过指定网格设置来更改网格或控制靠齐行为。无论网格是否可见，都可以使用靠齐。应用Dreamweaver CS6中的靠齐功能
8、，可以使层与网格之间的关系如铁块与磁铁之间的关系一般。另外，层与网格线之间靠齐的距离是可以设定的。层靠齐到网格更改网格设置8.2 应用层设计表格课堂案例课堂案例信业融资网页信业融资网页将将AP DivAP Div转换为表格转换为表格将表格转换为将表格转换为AP DivAP Div8.5.1课堂案例信业融资网页使用“将AP Div转换为表格”命令，将层转换为表格。效果图8.2.2 将AP Div转换为表格1、将AP Div转换为表格2、防止层重叠8.2.3 将表格转换为AP Div当不满意页面布局时，就需要对其进行调整，但层布局要比表格布局调整起来方便，所以需要将表格转换为AP Div。要将表格转换为AP Div，则选择“修改 转换 将表格转换为AP Div”命令，弹出“将表格转换为AP Div”对话框。根据需要完成设置后，单击“确定”按钮。“将表格转换为AP Div”对话框8.3课堂练习美味小吃网页使用“绘制AP Div”按钮，绘制层；使用“图像”按钮，插入图像；使用“CSS样式”命令，设置文字的大小和颜色；使用“移动层”命令，调整层的位置制作阴影效果。效果图8.4课后习题充气浮床网页使用“绘制AP Div”按钮，绘制层；使用“图像”按钮，在绘制的图层中插入图像。效果图
