网页设计与制作案例教程 教学配套课件 池同柱 第11章 布局对象的使用.pdfVIP

第11章布局对象的使用 一、AP元素面板 “AP元素”面板显示了网页中所有的 AP Div及各个AP Div之间的关系，在 “AP元素”面板中可以选择AP Div ，设置 AP Div 的显示属性、设置AP Div 的堆叠 顺序及重命名AP Div等。 1、打开“AP元素”面板：选择“窗口/AP Div”命令或 按F2键。 2、当前网页中的所有AP Div都会显示在“AP元素” 面板中，嵌套AP Div 以树状结构显示。 3、在“AP元素”面板中可对AP Div进行如下操作： a) 双击AP Div 的名称可对AP Div进行重命名。 b) 单击AP Div后面的数字可修改AP Div 的重叠顺 序，即Z轴顺序，数值大的将位于上AP Div 。 c) 在AP Div名称前面有一个眼睛图标，睁开的眼 睛图标表示该AP Div处于显示状态；闭合的眼 睛图标表示该AP Div处于隐藏状态；单击眼睛 图标可切换AP Div 的显示或隐藏。如果未显示 眼睛图标，表示没有指定可见性。选中“防止重 叠”复选框可以防止AP Div重叠，且不能创建嵌 套AP Div 。 4 、AP Div面板分为3栏，最左侧是眼睛标记，用 鼠标直接单击标记，可以显示或隐藏所有的 层；中间显示的是层的名称；最右侧是层在Z轴 的排列情况。 二、插入AP Div并设置其属性 1．创建AP Div 方法1：将插入栏切换到“布局”插入 栏，单击“绘制AP Div”按钮，鼠标光标将 变为“＋”形状，在编辑窗口中的任意位置 按下鼠标左键不放进行托动即可创建AP Div。 方法2 ：在菜单栏中选择“插入记录/布 局对象/AP Div”命令，插入AP Div 。 2. 创建嵌套AP Div AP Div可以进行嵌套。在某个AP Div 内部创 建的AP Div称为嵌套AP Div或子AP Div ，嵌套 AP Div外部的AP Div称为父AP Div 。子AP Div可 以浮动于父AP Div之外的任何位置，其大小不受 父AP Div 限制。 创建嵌套AP Div方法：将鼠标光标定位到所 需的AP Div 内，选择“插入记录/布局对象/AP Div”命令即可。如果要逐级添加子AP Div ，只需 将鼠标光标定位到所需的子AP Div 中，按创建嵌 套AP Div 的方法即可。 3. AP Div属性设置 可以在“属性”面板中对其AP Div 的属 性进行设置，下面分别介绍单个AP Div和 多个AP Div 的属性设置。 a、单个AP Div 的属性设置 选择要设置属性的单个AP Div ，其对 应的属性面板如图所示。  “左”文本框：设置AP Div左边相对于页面左边或父AP Div左边的 距离。  “上”文本框：设置AP Div顶端相对于页面顶端或父AP Div顶端的 距离。  “宽”文本框：设置AP Div 的宽度值。  “高”文本框：设置AP Div 的高度值。  “Z轴”文本框：设置AP Div 的Z轴顺序，也就是设置嵌套AP Div在 网页中的重叠顺序，较高值的AP Div位于较低值的AP Div上方。  “可见性”下拉列表框：设置AP Div 的可见性，其中default表示默 认值，其可见性由浏览器决定。inherit表示继承该层父级的可见 性；visible表示显示AP Div及其内容，与父AP Div 的可见性无 关；hidden表示隐藏AP Div及内容，与父AP Div 的可见性无关。  “背景图像”文本框：用于设置背景图像。  “背景颜色”文本框：设置AP Div 的背景颜色。  “类”下拉列表框：选择AP Div 的样式。  “溢出”下拉列表框：选择当AP Div 中的内容超出AP Div 的范围后 显示内容的方式。  “剪辑”栏：在该栏中可设置AP Div 的可见区域。其中“左”、“右”、 “上”、“下”4个文本框分别用于设置AP Div在各个方向上的可见区 域与AP Div