第9章-使用AP-Div元素.ppt

掌握AP Div的基本知识 1、 AP Div概述 2、 创建AP Div元素 3、 设置AP Div元素的属性 4、 AP元素面板 5、 AP Div元素的基本操作 * 1 AP Div概述 AP Div是DIV标签中的一种定位技术，在Dreamweaver中也被叫做图层，用来控制浏览器窗口中元素的位置、层次。AP Div最主要的特性就是它是浮动在网页内容之上的，也就是说，可以在网页上任意改变其位置，实现对AP Div的准确定位。把页面元素放在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元素。 * ?提示：在“插入”面板中选择“布局”标签，点击后，在文档窗口中，按住〈Ctrl〉键的同时按住鼠标左键拖曳鼠标，可以绘制多个AP Div元素。 在默认情况下，每当用户创建一个新的AP Div，都会使用DIV标志它，并将标记 显示到网页左上角的位置。创建的AP Div元素如图7-1所示。 若要在网页左上角显示出AP Div标记，首先选择“查看→可视化助理→不可见元素”命令，使“不可见元素”命令呈被选择状态，然后再选择“编辑→首选参数”命令，弹出“首选参数”对话框，选择“分类”选项框中的“不可见元素”选项，选择右侧的“AP元素的锚点”复选框，如图7-2所示，单击【确定】按钮完成设置。 图7-1 创建的AP Div元素 * 图7-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元素未被选中或激活情况下，按住〈Shift〉键的同时再单击AP Div元素中的任意位置。 * 在“AP Div元素”面板中，直接单击AP Div元素的名称。 选中AP Div元素后，其对应的“属性”面板如图7-3所示。 AP Div“属性”面板中各项含义： CSS-P元素：为选中的AP Div元素设置名称。名称由数字或字母组成，不能用特殊字符。每个AP Div元素的名称是唯一的。 左、上：分别设置AP Div元素左边界和上边界相对于页面左边界和上边界的距离，默认单位为像素（px）。也可以指定为pc（pica）、pt（点）、in（英寸）、mm（毫米）、厘米（cm）或%（百分比）。 图7-3 “AP Div”的属性面板 * 宽、高：分别设置AP Div元素高度和宽度，单位设置同“左”、“上”属性。 Z轴：设置AP Div元素的堆叠次序，该值越大，则表示其在越前端显示。 可见性：设置AP Div元素的显示状态。“可见性”右侧下拉列表框包括四个可选项：“default（缺省）”，选中该项，则不明确指定其可见性属性，在大多数浏览器中，该AP Div会继承其父级AP Div的可见性。“inherit（继承）”，选择该项，则继承其父级AP Div的可见性。“visible（可见）”，选择该项，则显示AP Div及其中内容，而不管其父级AP Div是否可见。“hidden（隐藏）”，选择该项，则隐藏AP Div及其中内容，而不管其父级AP Div是否可见。 背景图像：设置AP Div元素的背景图像。可以通过单击“文件夹”按钮选择本地文件，也可以在文本框中直接输入背景图像文件的路径确定其位置。 背景颜色：设置AP Div的背景颜色，值为空表示背景为透明。 * 类：可以将CSS样式表应用于AP Div。 溢出：设置AP Div中的内容超过其大小时的处理方法。“溢出”右侧下拉列表框中包括四个可选项：“visible（可见）”，选择该项，当AP Div中内容超过其大小时，AP Div会自动向右或者向下扩展。“hidden（隐藏）”，选择该项，当AP Div中内容超过其大小时，AP Div的