Head First HTML與CSS
第十一章 布局與定位
CSS——掌控頁面的表現(xiàn)
布局復(fù)習(xí)
1.浮動布局
float可將元素浮動到頁面一側(cè)鹃觉，元素從頁面正常流中浮出，正常流中的塊元素忽視它著角，內(nèi)聯(lián)元素繞行。
2.凝膠布局
先使用固定寬度的<div>創(chuàng)建凍結(jié)布局，再利用auto屬性允許外邊距擴(kuò)展澎埠，調(diào)整為凝膠布局措近。
3.絕對布局
使用絕對定位溶弟，可以將某個元素固定在頁面上的某個位置，不在頁面流中瞭郑。
4.表格顯示布局
利用CSS表格進(jìn)行分欄顯示辜御。
固定定位
一旦采用固定定位放置內(nèi)容，它就會一直留在你指定的位置屈张，即使你滾動頁面它也不動擒权。因為固定定位是相對于瀏覽器窗口的定位袱巨，而不是相對于頁面的定位。
#coupon{
position:fixed;
top:350px;
left:0px;
}
下滑頁面后：
也可以使用負(fù)位移量：
#coupon{
position:fixed;
top:350px;
left:-90px;
}
可以使用相對定位指定優(yōu)惠券的位置碳抄。這與絕對定位相似愉老，不過元素仍在頁面流中，只不過在它原本的位置上按照你指定的量偏移剖效。補(bǔ)充說一下俺夕，絕對定位將元素從頁面流中取出，允許你為它指定一個絕對位置贱鄙，這個位置是相對于其父元素指定的（一般是<html>）劝贸；固定定位則是相對于瀏覽器窗口，而相對定位會相對于其外圍包含的元素來定位逗宁，元素仍在正常的頁面流中映九，然后再按照你指定的量偏移元素。
