在CSS中設置cellpadding和cellspacing嗎？

在HTML表中，能夠像這樣設置cellpadding和cellspacing ：

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

使用CSS如何完成相同的工做？

---

#1樓

默認

瀏覽器的默認行爲等效於：

table {border-collapse: collapse;}
td    {padding: 0px;}

細胞填充

設置單元格內容和單元格壁之間的空間量

table {border-collapse: collapse;}
td    {padding: 6px;}

細胞間隔

控制表格單元格之間的空間

table {border-spacing: 2px;}
td    {padding: 0px;}

都

table {border-spacing: 2px;}
td    {padding: 6px;}

二者（特殊）

table {border-spacing: 8px 2px;}
td    {padding: 6px;}

注意：若是設置了border-spacing ，則表示表的border-collapse屬性是separate 。

本身嘗試！

在這裏，您能夠找到實現此目標的舊HTML方法。

---

#2樓

用div包裹單元格的內容，您能夠作任何想作的事，可是必須將每一個單元格包裹在列中才能得到統一的效果。 例如，要得到更大的左右邊距：

所以CSS將

div.cellwidener { margin: 0px 15px 0px 15px; } td.tight { padding: 0px; }

<table border="0"> <tr> <td class="tight"> <div class="cellwidener">My content</div> </td> </tr> </table>

是的，這很麻煩。 是的，它能夠與Internet Explorer一塊兒使用。 實際上，我僅使用Internet Explorer進行了測試，由於這是咱們容許在工做中使用的所有。

---

#3樓

從W3C分類中瞭解到， <table>是用於「僅」顯示數據的。

基於此，我發現建立一個具備背景和全部背景的<div>並使其具備一個position: absolute;浮動數據的表要容易position: absolute; background: transparent; ...

它能夠在Chrome，Internet Explorer（6和更高版本）和Mozilla Firefox（2和更高版本）上運行。

邊距用於（或始終意味着）在容器元素（例如<table> ， <div>和<form> ）之間建立間隔符，而不是<tr> ， <td> ， <span>或<input> 。 將其用於除容器元素以外的任何其餘內容，將使您忙於調整網站以供未來瀏覽器更新。

---

#4樓

table
{
    border-collapse: collapse; /* 'cellspacing' equivalent */
}

table td, table th
{
    padding: 0; /* 'cellpadding' equivalent */
}

---

#5樓

我用!important在邊框崩潰以後像

border-collapse: collapse !important;

它在IE7中對我有用。 彷佛覆蓋了cellpacing屬性。