問題

在HTML表中,cellpaddingcellspacing可以設定如下:

 <table cellspacing="1" cellpadding="1">
 

如何使用CSS完成同樣的工作?

  最佳答案

基礎知識

為了控制CSS中的“cellpadding”,您可以簡單地在表單元格上使用padding.例如對於“cellpadding”的10px:

 td { 
    padding: 10px;
}
 

對於“cellphone”,您可以將border-spacing CSS屬性應用到表中.例如,對於“cellphone”的10px:

 table { 
    border-spacing: 10px;
    border-collapse: separate;
}
 

這個屬性甚至允許單獨的水平間距和垂直間距,這與學校的“細胞間距”無關。

IE中的問題<=7

這將在幾乎所有流行的瀏覽器中工作,除了透過Internet Explorer 7進行的Internet Explorer,其中你幾乎沒有運氣.我說“幾乎”,因為這些瀏覽器仍然支援border-collapse屬性,它合併了鄰近表單單元格的邊界.如果你試圖消除細胞間距(即cellspacing="0"),那麼border-collapse:collapse應該具有相同的效果:表單元格之間沒有空格.這種支援是錯誤的,但是,因為它不覆蓋表元素上的現有cellspacing HTML屬性.

簡言之:對於非Internet Explorer 5-7瀏覽器,border-spacing處理您.對於Internet Explorer,如果您的情況是正確的(您希望0 cellphone並且您的表沒有定義它),您可以使用border-collapse:collapse.

 table { 
    border-spacing: 0;
    border-collapse: collapse;
}
 

注意:對於一個可以應用於表和瀏覽器的CSS屬性的概覽,請參閱這個奇妙的Quirksmode page .

  相同標籤的其他問題

htmlcsshtml-tablealignment