在css中爲table 後表格單元格邊界異常的解決辦法

在css中添加border-collapse:collapse或在js中添加borderCollapse = "collapse"能夠消除單元格間的間距,
但是,如果用js對table進行操作完後,table需要重新計算列寬時,個別單元格的邊界會很不聽話,仍然維持原來的寬度,這時刪除表格的border-collapse:collapse就能恢復正常,
但單元格間會產生間距。尤其在使用<colgroup>標記來動態顯示/隱藏列時,ff一加載就有問題,ie在對colgroup操作以後也會有問。這個問題很煩。

1.現在想到的唯一的解決辦法是在html中添加cellpadding="0" cellspacing="0"屬性,這個似乎和css,js中的 border-collapse不一樣,但也能去除單元格間距,而且不會產生邊界問題。

但會產生另一個問題:如果單元格中沒有內容,單元格不顯示邊框,網上搜了一下,最後找到一個兼容ff和ie7/8 的方法:

在表格的css中加empty-cells:show;這個ff支持,ie不支持。然後再用js判斷一下瀏覽器,如果是ie就$("table").rules="cols"; rules:cols屬性雖然ff也支持,但會產生上面說過的問題即單元格邊框錯位。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章