使用APDiv布局网页.pptVIP

第八章　使用AP Div布局网页 第八章　使用AP Div布局网页 本章学习要点： AP Div的基本概念 AP Div的创建和基本操作 AP Div与表格的相互转换 AP Div综合应用 8.1 学习任务：AP Div基础知识 所谓AP Div，是指存放用DIV标记描述的HTML内容的容器，用来控制浏览器窗口中元素的位置、层次。在Dreamweaver CS3环境下，可以利用AP Div灵活方便的进行页面布局。 AP Div最主要的特性就是它是浮动在网页内容之上的。也就是说，可以在网页上任意改变其位置，实现对AP Div的准确定位。 AP Div可以相互堆叠，通过定义AP Div的层次关系，可以方便实现文字阴影等效果； 8.1.2 创建AP Div元素工具栏 在Dreamweaver中可以通过“布局”工具栏方便的创建AP Div元素 在菜单栏中，选择“插入→布局”命令，可以展开“布局”工具栏。在“标准”模式下，和AP Div创建有关的是“插入Div标签”按钮和“绘制AP Div”按钮。 “插入Div标签”按钮：单击此按钮，在文档中自动插入一个AP Div元素。 “绘制AP Div”按钮：单击此按钮，将鼠标指针移到文档窗口中，鼠标指针变为十字状，按下鼠标并拖动，可以绘制一个AP Div元素。 8.1.3 AP Div元素的“属性”面板 AP Div“属性”面板中各项含义如下： CSS-P元素：为选中的AP Div元素设置名称。名称由数字或字母组成，不能用特殊字符。每个AP Div元素的名称是唯一的。 左、上：分别设置AP Div元素左边界和上边界相对于页面左边界和上边界的距离，默认单位为像素（px）。也可以指定为pc（pica）、pt（点）、in（英寸）、mm（毫米）、厘米（cm）或%（百分比）。 宽、高：分别设置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的大小不变，也不会出现滚动条，超出AP Div内容不被显示。 scroll（滚动）：选择该项，无论AP Div中的内容是否超出AP Div的大小，AP Div右端和下端都会显示滚动条。 auto（自动）：选择该项，当AP Div内容超过其大小时，AP Div保持不变，在AP Div右端和下端都出现滚动条，以使其中的内容能通过拖动滚动条显示。 剪辑：设置AP Div可见区域大小。在“上”、“下”、“左”、“右”文本框中，可以指定AP Div可见区域上、下、左、右端相对于AP Div边界距离。AP Div经过剪辑后，只有指定的矩形区域才是可见的。 8.1.4 AP元素面板 “AP元素”面板各选项含义如下： 防止重叠：选中此选项，可以防止AP Div元素之间发生重叠。不选中此复选框，AP元素则可以相互重叠。该选项主要用在AP Div和表格相互转换时，当将AP Div转换为表格，为防止浏览器不兼容，选中该选项，以防止AP元素相互重叠。 图标：如果某一个AP 元素左侧有该图标，表示该AP 元素可见，如果图标变成，则不可见。如果没有该图标，表示该层继承其父级AP Div元素的可见性。如果没有父级AP Div元素，则父级AP Div元素可以看成其本身，通常情况下，这意味着是可见的。可以通过单击图标控制该AP Div的可见属性。 名称：该属性用来显示和更改AP Div元素的名称。如果想更改该AP Div元素的名称，可以通过双击名字进行更改。 Z：该属性见“属性”面板相关设置。可以通过双击AP Div元素的Z值属性