Head First HTML與CSS
第十一章 布局與定位
CSS——掌控頁面的表現
布局復習
1.浮動布局
float可將元素浮動到頁面一側，元素從頁面正常流中浮出，正常流中的塊元素忽視它，內聯元素繞行。
2.凝膠布局
先使用固定寬度的<div>創建凍結布局，再利用auto屬性允許外邊距擴展，調整為凝膠布局。
3.絕對布局
使用絕對定位，可以將某個元素固定在頁面上的某個位置，不在頁面流中。
4.表格顯示布局
利用CSS表格進行分欄顯示。
固定定位
一旦采用固定定位放置內容，它就會一直留在你指定的位置，即使你滾動頁面它也不動。因為固定定位是相對于瀏覽器窗口的定位，而不是相對于頁面的定位。
#coupon{
position:fixed;
top:350px;
left:0px;
}
下滑頁面后：
也可以使用負位移量：
#coupon{
position:fixed;
top:350px;
left:-90px;
}
可以使用相對定位指定優惠券的位置。這與絕對定位相似，不過元素仍在頁面流中，只不過在它原本的位置上按照你指定的量偏移。補充說一下，絕對定位將元素從頁面流中取出，允許你為它指定一個絕對位置，這個位置是相對于其父元素指定的（一般是<html>）；固定定位則是相對于瀏覽器窗口，而相對定位會相對于其外圍包含的元素來定位，元素仍在正常的頁面流中，然后再按照你指定的量偏移元素。
