1. 程式人生 > >table之thead兼容

table之thead兼容

檢查 們的 今天 問題 explore 內部使用 部分 xhtml 兼容

今天遇到一個小bug,是關於table中thead,tbody,tfoot的兼容問題:

在開發的時候為了方便寫樣式,我就把表格的標題部分關於th的內容放在了thead中,當然了,我也沒有寫tbody和tfoot,此時,檢查兼容的時候問題隨之而來:

  在IE,Chrome,Opera下都沒問題,但是在Firefox中出現了一個問題,下面tr的內容統一向上走了一個tr,最後一個tr的內容變為空了,與thead的內容重合,我首先想到的是我沒有浮動啊,什麽情況。隨後我檢查了下元素,將thead改為tr,問題解決。

  隨後我搜了下thead兼容問題,W3C的解釋是:

  註釋:如果您使用 thead、tfoot 以及 tbody 元素,您就必須使用全部的元素。

它們的出現次序是:thead、tfoot、tbody,這樣瀏覽器就可以在收到所有數據前呈現頁腳了。您必須在 table 元素內部使用這些標簽。<thead> 內部必須擁有 <tr> 標簽!

  提示:在默認情況下這些元素不會影響到表格的布局。不過,您可以使用 CSS 使這些元素改變表格的外觀。<thead>、<tbody> 以及 <tfoot> 很少被使用,這是因為糟糕的瀏覽器支持。我們期望在 XHTML 的未來版本中這種情況會發生變化。假如您使用 Internet Explorer 5.0 或更新的瀏覽器,可以在我們的 XML 教程中查看一個例子。

  最後自己總結下:thead,tbody,tfoot盡量不用了,如果要用就全部用上且記得把tr寫在thead中;

table之thead兼容