雖然在xhtml+css 時(shí)代 table的使用越來(lái)越少，但需要布局數據型元素，用table還是很不錯的選擇。

      用table制作表格的時(shí)候美觀(guān)也很重要，其中的邊框。在HTML中,表格的默認樣式大概是這樣:

      默認的樣式雖然有點(diǎn)立體的感覺(jué)，但它在整體布局中并不是很美觀(guān)，通常情況下,我們會(huì )把table屬性的cellspacing設成1,然后為整個(gè)表格設一 個(gè)背景色;或是設置table的border為0，然后為所有td設置border-left和border-right,可以得到如下效果：

      這種方法比較常用，但是有些復雜，而且如果表格內容為空的情況下IE會(huì )不顯示邊框。

      另一種方法就是用CSS中的border-collapse屬性,它有兩個(gè)參數

值	描述
separate	邊框會(huì )被分開(kāi)。
collapse	默認。如果可能，邊框會(huì )被合并為一個(gè)單一的邊框。

       這里我們會(huì )用到： border-collapse:collapse; 在table中加入border-collapse:collapse;屬性，并設置border為0,設置td{border:1px solid #ccc;}邊框。就可以得到與第一種方法相同的效果。這種方法相對簡(jiǎn)單，而且在表格內容為空的情況下，邊框不會(huì )出現不顯示的情況。

---

下面順便帶上CSS border-collapse 屬性：

CSS border-collapse 屬性

定義
border-collapse 屬性設置表格的邊框是否被合并為一個(gè)單一的邊框，還是象在標準的 HTML 中那樣分開(kāi)顯示。
繼承性：Yes

腳本語(yǔ)法：
CSS 屬性也可通過(guò)一段 JavaScript 被動(dòng)態(tài)地改變。
object.style.borderCollapse="collapse"

例子

table
      {
        border-collapse: separate;
      }

可能的值

值	描述
separate	邊框會(huì )被分開(kāi)。
collapse	默認。如果可能，邊框會(huì )被合并為一個(gè)單一的邊框。