第12章 APDiv 对于有Dreamweaver基础的读者来说,初识APDiv或 许会感到即熟悉又陌生。熟悉于它的Div标识符, 陌生于他在CS3版本中的含义及作用。其实,APDiv 在Dreamweaver CS4中仍等同于前期版本的层,又 称为AP元素或CSS-P元素,本文以下简称AP层。 什么是层?有什么作用?前面我们学习过了表格, 知道了表格可以作为页面布局的容器。AP层也是作 为网页布局的容器,AP层内可以包含文本、图形图 像、动画、音频、视频、表格等一切可以放置到 HTML中的元素,甚至可以在AP层内放置AP层。本章 我们就为大家详细的介绍一下AP层的相关内容。
12.1 AP层的创建与属性 12.1.1 创建AP层 12.1.2 AP层的属性
12.1.1 创建AP层 在Dreamweaver CS4中,AP层的创建创建层的方法有 两种。 将插入点放置在要创建层的地方, “插入”→“布 局对象” →“AP Div” 。 选择“插入”工具栏中的“布局”选项卡,单击 “绘制层”按钮
12.1.2 AP层的属性 利用“属性检查器”对AP层属性进行设置,可以调整 创建好的AP层,达到预期的网页布局效果。AP层的属 性包括ID、位置、大小、Z轴、可见性、背景、类、 溢出、剪辑等基本属性,如图12.9所示。
12.2 AP层的基本操作 层的基本操作包括AP层的激活与选择,插入内容,调 整AP层的位置、大小、层叠顺序、可见性、背景、对 齐方式等。
12.2.1 选择AP层 若要对层进行操作与编辑,首先得选择AP层。选择AP 层是为了对AP层的属性进行操作。 在“层”面板中,单击层名称,这时所选择的层就会出现 控制点,表示选中,并且可以操作了。 将光标移到层的边框处,当光标变成十字形时单击。 如果选中多个层,可按下Shift键,然后在层面板或是文档 窗口中直接单击层边框来一一选择需要的层,即可实现多选。
12.2.2 在AP层内插入内容 当AP层被选中之后,就可以在AP层内输入或从其他文 件中复制粘贴相应文本内容,也可单击“插入”工具 栏“常用”类别中的各种按钮,插入图像、媒体、脚 本等内容。
12.2.3 调整AP层的位置 很多情况下AP层的创建位置不是期望的位置,这时可 以通过以下操作,精确调整AP层的位置。
12.2.4 调整AP层的大小 与AP层的位置一样,AP层的大小有时也不理想,就要 对其进行精确调整。
12.2.5 改变AP层的层叠顺序 使用“AP元素”面板或使用“属性检查器”都改变AP 层的层叠顺序。
12.2.6 改变AP层的可见性 AP层可见性的改变也可通过 “AP元素”面板与“属性检查器”来实现。 (1)单击“窗口”|“AP元素”打开“AP元素”面板,如图12.25所示。 (2)用鼠标单击要更改AP层名称前面的眼睛图标即可改变AP层的可见性。闭上 的眼睛图标表示AP层被隐藏,处于不可见状态;睁开的眼睛图标表示AP层被显 示,处于可见状态;没有眼睛图标表示该AP层继承其父AP层(即被嵌套AP层) 的可见性属性。 注意:若想统一更改所有AP层的可见性,可用鼠标单击列顶端的眼睛图标。 (3)在“属性检查器”中更改。选中要设置可见性的AP层,在“属性检查器” 中“可见性”下拉列表框中选择相应可见性选项即可,如图12.26所示。
12.2.7 设置AP层的背景 设置AP层的背景包括添加背景颜色和插入背景图片。
12.2.8 对齐AP层 当有多个AP层时,可以对它们进行对齐操作,包括左对齐、 右对齐、上对齐与对齐下缘,以最后一个选定AP层的边框位 置为标准对齐。具体操作步骤如下: (1)选中创建好的多个AP层,如图12.32所示。最右端的AP 层为最后选中的AP层。 (2)单击“修改”|“排列顺序”|“对齐下缘”命令菜单, 将所有选中的AP层以最后选中的AP层的下边框为标准对齐, 效果如图12.33所示。其他对齐操作与其类似,就不再重复 讲解。
12.2.9 AP层与表格间的转换 在Dreamweaver CS4中,可以实现AP层与表格之间的 相互转换。具体操作步骤如下: “修改” →“转换” →“将AP Div转换为表格” “修改” →“转换” →“将表格转换为AP Div”