41、Dreamweaver AP元素使用与布局教程

Dreamweaver AP元素使用与布局教程

1. AP元素定位基础

1.1 相对定位与绝对定位

相对定位时，设置 Top 属性为100像素，AP元素并非距离浏览器窗口顶部100像素，而是基于HTML原本显示位置向下偏移100像素。而绝对定位能让AP元素精确放置在页面某一位置，例如将绝对定位元素的 Top 和 Left 属性分别设为100和150像素，该元素就会距离浏览器窗口顶部100像素、左侧边缘150像素。

需要注意的是，对于嵌套在另一个设置了相对或绝对定位的 <div> 内的 <div> ，浏览器会根据父 <div> 的位置计算其位置值。比如，页面顶部300像素处有一个AP元素，其内部嵌套的绝对定位元素 Top 位置为20像素，那么该元素并非距离页面顶部20像素，而是距离父AP元素顶部20像素，即距离页面顶部320像素。

1.2 Clip属性

Clip 属性可隐藏AP元素除矩形区域外的部分，但多数情况下应避免使用，因为它仅在制作动画特效时有用。例如，将大图片放入AP元素却只想显示一小部分，虽可使用 Clip 属性，但浏览器仍会下载整个图片。更好的做法是提前准备好合适尺寸的小图片。

Clip 的四个设置（ top 、 right </