《DREAMWEAVER+CS4+网页设计与制作指南第9章.ppt》由会员分享，可在线阅读，更多相关《DREAMWEAVER+CS4+网页设计与制作指南第9章.ppt（20页珍藏版）》请在三一办公上搜索。
1、第9章 AP Div,AP Div（绝对定位元素）是分配有绝对位置的HTML的一种页面元素，在网页制作过程中，文本、图像、表格等都是在二维空间内对网页元素进行固定位置的控件操作，而使用AP Div则让页面元素向三维空间的延伸和扩展，让设计者有了更大的发挥空间。本章重点内容：AP层的创建与属性AP层的基本操作AP层的常见布局方式,9.1 AP层的创建与属性,在Dreamweaver CS4中，AP层可以用来设计网页的布局，可以进行隐藏和显示的控制，也可以在文档设计视图中移动AP层，也可以在两个AP层中设置层的背景图像。利用AP层可以让位置更加灵活和机动，同时AP层也可以实现和表格的相互转换。,9
2、.1.1 插入Div标签,在网页中放置AP层时，标识符用实现。在Dreamweaver CS4中，AP层可以通过插入Div标签或绘制AP层的方式实现。,9.1.2绘制AP Div,AP Div可以手工绘制，根据需要绘制AP层，位置更为灵活。,9.1.3创建嵌套AP层,AP层可以像表格一样嵌套，并且根据嵌套关系互为影响。,9.1.4AP层的属性,层除了可以用层面板来进行一些设置，更多的属性还是要借助于“属性”面板。选中层（单击层的外边框，即可选中层），可以在层的“属性”面板中设置层的属性。,9.1.5AP元素面板,按F2键，或选择菜单命令“窗口”“AP元素”，打开“AP元素”面板。层的可见性防止
3、层重叠,9.2AP层的基本操作,本节重点介绍AP层的基本操作，包括AP层的激活与选中、在AP层内插入内容、调整AP层的大小、调整AP层的位置、防止AP层重叠、AP层的对齐、拖动AP层、改变AP层的可见性、设置AP层的背景、AP层与表格的相互转换等。AP层的激活与选中多个层的选中,9.2.2 在AP层内插入内容,层的使用，可以让网页在排版方面更灵活。层因为操作简单，可以方便将网页中任何一个元素进行定位，但是层也不是随意的摆放位置，需要和表格等元素进行配合，这样排版出来的网页才会更科学合理。,9.2.3 调整AP层的大小,【本节示例参考：资料光盘案例第9章9-2-3.htm】【实例9-7】调整AP
4、层大小。已经创建完的AP层，如果宽度和高度不合适，可以随时进行调整，选中层以后，层的四周出现了控制点。,9.2.4 调整AP层的位置,AP层创建后，可以调整位置，与相应的布局对象搭配，以便适应网页整体布局。,9.2.5 AP层的对齐,一个页面可以允许多个AP层同时存在，并可以根据需要进行对齐方式的设置。,9.2.6拖动AP层,AP层创建后，不光可以改变大小及内容，还可以随时拖动改变AP层的位置。,9.2.7设置AP层的背景,AP层可以设置背景，包括设置背景色和背景图片。设置背景颜色设置背景图片,9.2.8AP层与表格的相互转换,在上面对AP层的操作过程中，不难发现在浏览器大小有所变化或显示器的
5、分辨率变化时，AP层的位置都有所变动，这有时不是我们想要的效果，就需要将AP层与表格进行必要的转换。AP层可以转换为表格，表格也可以转换为AP层。AP层转换为表格表格转换为层,9.3 AP层的常见布局形式,常见的AP层布局形式大致有3种：“多行单列”、“单行多列”、“多行多列”。,9.3.1多行单列,由AP层创建的网页布局常用的最简单的方式是“多行单列”。,9.3.2单行多列,AP层的布局为单行多列，也是常用的布局方式。,9.3.3多行多列,多行多列作为网页布局的一种，是经常遇到的方式，也是难度相对较大的布局类型。,9.4 本章小结,应用AP Div对网页进行排版布局有着很大的灵活性，结合JavaScript和HTML可以轻松玩转网页的动态效果。AP层与表格都能对网页布局，也各有优缺点，相对而言，表格布局比较容易控制，而且受分辨率的影响不大，对于各种浏览器的兼容性也很好，但缺点是表格布局生成的代码较为繁琐，也不利于网页的代码维护和网页优化。,
