跨瀏覽器的實踐:position:fixed 層的固定定位

更新時間：2008年11月16日 01:59:58 作者：

一般要固定某個div,我們都會讓該div{position:fixed},它的下一個div{position:absolute}看了幾個國外的關(guān)于CSS的固定定位跨瀏覽解決方案.他們卻反其道而為之

看示例吧:
<style type="text/css">
body{
margin:0;
padding:30px 0 0 0;
}
div#menu{
position:absolute; top:0;
left:0;
width:100%;
height:30px;
background-color:#ddd;
}
@media screen{
body>div#menu{
position:fixed;
}
}
* html body{
overflow:hidden;
}
* html div#content{
height:100%;
overflow:auto;
}
</style>
HTML示例:

[Ctrl+A 全選注:引入外部Js需再刷新一下頁面才能執(zhí)行]

你刪除第一行注釋看看效果如何?

您可能感興趣的文章:

相關(guān)文章

做網(wǎng)頁字體大小參考網(wǎng)頁中同字號字體的不同單位對比列表
做網(wǎng)頁字體大小參考網(wǎng)頁中同字號字體的不同單位對比列表...
2007-08-08
頁面布局黃金比例[圖片]
2007-12-12
XHTML下用dl,dt,dd標(biāo)簽實現(xiàn)翻頁的效果代碼
XHTML下用dl,dt,dd標(biāo)簽實現(xiàn)翻頁的效果代碼...
2007-09-09
DIV border邊框顯示不完全問題的解決方法
今天制作div下的li分兩列顯示發(fā)現(xiàn)，兩邊的邊框無法完全顯示，或顯示斷斷續(xù)續(xù)的，或者拖動滾動條就出現(xiàn)邊框的顯示問題
2008-05-05
CSS expression控制圖片自動縮放效果代碼[兼容 IE,Firefox]
一直以來有個很頭疼的問題困擾著我，那就是圖片縮放的問題，寫到 JS 里面吧，不太容易修改。寫到 CSS 里面吧，IE 6 又不支持 max-width
2008-09-09
DIV和CSS排版中制作細(xì)線條的方法小結(jié)
DIV和CSS排版中制作細(xì)線條的方法小結(jié)...
2007-09-09
如何解決下拉菜單被flash覆蓋的問題
如何解決下拉菜單被flash覆蓋的問題...
2007-01-01
DIV CSS網(wǎng)頁布局最小高度（min-height）的妙用
最小高度可以設(shè)定一個BOX的最小高度，當(dāng)其內(nèi)容較少時時，也能保持BOX的高度為一定，超出就自動向下延伸，但到目前為止，只有Opera 和 Mozilla 支持，IE7開始也支持了，但I(xiàn)E7處于測試階段，等正式版發(fā)布到普及需一段也許比較長的時間，除非MS把它捆綁在某個操作系統(tǒng)上，如何在現(xiàn)有基礎(chǔ)上（IE6 80-90%），合理、妙用最小高度了？
2008-11-11
input為disabled提交后得不到該值的解決方法
input的字段當(dāng)為diabled時時無法獲取數(shù)值得，所以最近不要用這個，我們可以用readonly帶替代，即可解決這類問題
2008-09-09
IE6不能正常解析CSS文件問題的解決方法及原因分析
IE6因為編碼問題無法正確解析CSS文件
2008-12-12