關于在html中浮動層是眾多網頁愛好者剛開始的難點，主要在于定位。如果你對CSS定位還不夠了解 可以接著往下看，運行里面的內容即可。
【需求】：
將一個網頁分成頭、身和腳三部分。如下：
————————————————————
頭
————————————————————
身
————————————————————
腳
————————————————————
要求：1、頭腳等高，并且頭位于瀏覽器頂部，腳位于瀏覽器底部，身高可變化；
2、在身的左右分別放置兩個垂直居中的div，類似浮動廣告條，位置固定，不隨滾動條的滾動和滾動；
【問題】：
1、如何固定層？
復制代碼代碼如下:
/* 全局浮動層固定默認樣式設置，支持FF和IE */
.fixed {position:fixed;}
* html div.fixed {position:absolute; right:16px;} /* [only for ie] “right=16px”是為了顯示滾動條,即right最小值為16px */
以下摘抄一部分文字如下：
由于廣告的濫用，使得一些瀏覽器軟件都開始有了廣告內容攔截，使得一些很好的效果現在都不推薦使用了。比如讓一個元素可能隨著網頁的滾動而不斷改變自己在瀏覽器的位置。而現在我可以通過CSS中的一個定位屬性來實現這樣的一個效果，這個元素屬性就是曾經不被支持的position:fixed; 他的含義就是：固定定位。這個固定與絕對定位很像，唯一不同的是絕對定位是被固定在網頁中的某一個位置，而固定定位則是固定在瀏覽器的視框位置。
雖然原來的瀏覽器并不支持過個屬性，但是瀏覽器的發展使得現在的高級瀏覽器都可以正確的解析這個CSS屬性。并且通過CSS HACK來讓IE6都可以實現這樣的效果（目前無法使IE5.x）實現這種效果。
2、如何垂直居中？
這個問題其實就是DIV絕對定位是居中問題。其實so easy！以下是我的思路：只要將該固定定位的div的top設為50%，然后將上移到該層的高度的一半就行了(margin-top為負)，例如，如果某div高度為200px，要使得該div垂直居中，只要設置"position:absolute;top:50%;margin-top:-100px"，就是這么簡單！
因此，水平居中也解決了，如果該層寬度為300px，那么"position:absolute;left:50%;margin-left:-100px"代碼可以解決水平居中問題。
即水平又垂直，那就將兩者結合起來嘍！嘿嘿。。。
新聞熱點
疑難解答
