[轉]position:fixed; 在IE9下無效果的問題

時間 2019-11-15

原文原文鏈接

本文轉自：http://www.cnblogs.com/xinwang/archive/2013/04/06/3002384.htmlhtml

日常DIV+CSS佈局時，position屬性通常用absoulte|relative用到的比較多；昨晚在作到一個靜態網頁，在實現騰訊的空間頭部的導航欄時用到position:fixed;屬性---代碼以下：佈局

 1 <html>
 2     <head>
 3         <title></title>
 4     </head>
 5     <body style="margin:0;">
 6         <div style="position:fixed; top:0; left:0; width:100%; background-color:#234533; height:30px; dispalay:inline;"></div>
 7         <div style="height:1000px;">
 8         </div>
 9     </body>
10 </html>

運行發如今Google Chrome,FireFox均可以的，可是在IE9就不行了非常鬱悶，由於IE6以上的版本都是支持fixed的屬性的；上網上找了很久沒找到，由於不知道關鍵字該怎麼搜，最後用最笨的方法，查看源碼，一點點找最終發現之前被本身忽視的問題：HTML 裏面的<!DOCTYPE>標籤。後果斷在頭部加上<!DOCTYPE HTML>解決；this

<!DOCTYPE HTML>
<html>
    <head>
        <title></title>
    </head>
    <body style="margin:0;">
        <div style="position:fixed; top:0; left:0; width:100%; background-color:#234533; height:30px; dispalay:inline;"></div>
        <div style="height:1000px;">
        </div>
    </body>
</html>

　發現日常被本身忽略的問題，因而上W3SCHOOL上仔細看了下，發現DOCTYPE屬性的選擇有些時候是很重要的，會形成CSS失效等多種問題：spa

但願能夠對和我遇到相同問題的有所幫助http://www.w3school.com.cn/tags/tag_doctype.aspcode

相關標籤/搜索