今天介紹一個網頁上常用的右下角布局實例,其實實現起來挺簡單,也就是相對定位和絕對定位的用法,這裡要使用絕對定位:
CSS代碼部分:
1
* {margin:0;padding:0;}/*設置頁面邊距為0,可以去掉,依你網頁而定*/
2
.rigdown {position:fixed;bottom:0;right:0;_position:absolute;width:300px;height:250px;border:2px solidgreen;background:#eeeeee;padding:10px;}/*在此絕對定位距頁面的距離,右邊=0,下邊=0*/
Html部分:
1
<body>
2
<div class="rigdown">這裡是右下角中要顯示的內容哦</div>
3
</body
為了兼容其它浏覽器,使用了position:fixed;以及_position:absolute;,大家可作下測試,我在IE8下完美實現。