DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> HTML基礎知識 >> HTML和Xhtml >> HTML5網頁制作實例:讓IE8支持footer標簽
HTML5網頁制作實例:讓IE8支持footer標簽
編輯:HTML和Xhtml     

因為我們網站不需要兼容ie6,7,我就在網站上用了footer這個標簽,結果發現ie9倒是支持這個標簽,但是發現ie8卻不支持這個標簽,代碼:

<!doctype html>
 
<html>
 
        <head>
 
                <style type="text/css">
 
                footer{
 
                display:block;
 
                }
 
               
                </style>
 
                <script type="text/javascript">
 
                        document.createElement("footer");
 
                </script>
 
       
 
        </head>
 
        <body>
 
                <footer>
 
                        <p>
 
                                我是一個段落
 
                        </p>
 
                </footer>
 
       
 
        </body>
 
</html>

放到ie8浏覽以下,大家可以發現在ie8裡,footer部分的代碼ie8遇到這個標簽就自動閉合了。ie8裡footer部分代碼是這樣的。

<footer />
 
      <p>
 
           我是一個段落
 
      </p>
 
<footer />

這樣就會導致你在ie8裡不認這些標簽,當然ie6,7就更不認了,到時候這些浏覽器裡布局就會亂。
於是我寫了以下css代碼。

footer{display:block;}

心想,這下ie8該人的這個標簽了吧,
結果ie8卻還是不支持。

在網上找到,原來光這樣寫寫css還不行,在為標簽設置display:block的同時還得用js在文檔裡創建這個元素,現在代碼如下,ie8已經認識這個標簽,而不會遇見這個標簽就給它自動閉合了。

<!doctype html>
 
<html>
 
        <head>
 
                <style type="text/css">
 
                footer{
 
                display:block;
 
                }
 
               
                </style>
 
                <script type="text/javascript">
 
                        document.createElement("footer");
 
                </script>
 
       
 
        </head>
 
        <body>
 
                <footer>
 
                        <p>
 
                                我是一個段落
 
                        </p>
 
                </footer>
 
       
 
        </body>
 
</html>

哈哈,這下以後可以放心的在頁面上用html5標簽了。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved