網(wǎng)站建設(shè)中，如果兩個或多個邊框相鄰，它們會相互合并。實(shí)際上，并不是完全合并，而是要看其中哪一個在其他邊框中占上風(fēng)。哪些邊框會勝出，哪些邊框會被合并，對此有一些嚴(yán)格的規(guī)則：

如果某個合并邊框的border-style為hidden，它會優(yōu)先于所有其他合并邊框。這個位置上的所有邊框都隱藏。

如果某個合并邊框的border-style為none，它的優(yōu)先級最低。這個位置上不會畫出該邊框，除非所有其他合并邊框的border-style值都是non%注意，none 是 border-style 的默認(rèn)值。

如果至少有一個合并邊框的border-style值不是none，而且所有合并邊框的border-style值都不是hidden，則窄邊框不敵更寬的邊框。如果多個合并邊框有相同的寬度，則會考慮邊框樣式，并采用以下順序（從最優(yōu)先到最不優(yōu)先）：double、solid、dashed、dotted、ridge、outset、groove、inset，因此，如果兩個有相同寬度的邊框合并，而其中一個是dashed邊框，另一個是outset邊框，該位置上的邊框?qū)⑹翘摼€邊框。

如果合并邊框的樣式和寬度都一樣，但是顏色不同，則按下表煩序使用元素的顏色（從最優(yōu)先到最不優(yōu)先）： cell、row、row group、column、column group, table。因此，如果一個單元格和一個列的邊框合并（除顏色外，所有其他方面都一樣），會使用單元格的邊框顏色（和樣式及寬度）。如果合并邊框來自相同類型的元素，如兩個有相同樣式和寬度但不同顏色的行邊框，則顏色取最上最左邊框的顏色（在從左向右讀的語言中是這樣，而在從右向左讀的語言中，則取最上最右邊框的顏色）。

以下樣式和標(biāo)記有助于說明這4個規(guī)則（結(jié)果見圖11-9所示）：

table{border-collapse: collapse;

border: 3px outset gray;}

td {border: 1px solid gray; padding: 0.5em;}

#r2c1,#r2c2 {border-style: hidden;}

#r1c1,#r1c4 {border-width: Spx;}

#r2c4.{border-style: double; border-width: 3px;}

#r3c4 {border-style: dotted; border-width: 2px;}

#r4c1 {border-bottom-style: hidden;}

#r4c3 {border-top: 13px solid silver;}

<table>

<tr>

<td id="r1c1">1 -1</td><td id="r1c2">1-2</td>

<td id="r1c3">1-3</td><td id="r1c4">1-4</td>

</tr>

<tr>

<td id="r2c1*>2-l</td><td id="r2c2">2-2</td>

<td id=T2c3->2-3</td><td id="r2c4">2-4</td>

<td id="r3cl">3-1</td><td id="r3c2">3-2</td>

<td id="r3c3">3-3</td><td id="r3c4">3-4</td>

</tr>

<tr>

<td id="r4cl">4-1</td><td id="r4c2">4-2</td>

<td id="r4c3">4-3</td><td id=T4c4">4-4</td>

</tr>

</table>

下面依次考慮網(wǎng)頁設(shè)計(jì)人員對各個單元格發(fā)生了什么：

對于單元格1-1和1-4, 5像素的邊框比其他所有相鄰邊框都寬，所以5像素的邊框不僅會勝出其相鄰單元格邊框，還會優(yōu)先于表本身的邊框，只有單元格1-1的下邊框例外，在此不再顯示5像素的邊框，

單元格1-1的下邊框之所以沒有勝出，是因?yàn)閱卧?-1和2-2顯式聲明了邊框隱藏，這就從這些單元格的邊界上去除了所有邊框。同樣地，表的邊框（單元格2-1左邊界上的邊框）也落敗于該單元格的邊框。單元格4-1的下邊框也隱藏，所以這個單元格下面不會出現(xiàn)任何邊框。

單元格2-4的3像素寬double邊框頂部被單元格1-4的5像素實(shí)線邊框所覆蓋，不過這個double邊框會覆蓋該單元格本身與單元格2-3之間的邊框，因?yàn)檫@個double 邊框不僅更寬而且“更有意思”。單元格2-4的邊框還覆蓋了它自己與單元格3-4之間的邊框，盡管二者寬度相同，但單元格2-4邊框的double樣式定義為比單元格3-4的dotted邊框“更有意思”。

單元格3-3的13像素銀色下邊框不僅會覆蓋單元格4-3的上邊框，還會影響這兩個單元格以及包含這兩個單元格的行中的內(nèi)容布局。

對于沿著表外邊界而且沒有指定樣式的單元格，其1像素實(shí)線邊框會被table元素本身的3像素outset邊框所覆蓋。

聽上去很復(fù)雜，也確實(shí)如此，不過這些行為都很直觀，通過動手實(shí)踐就會更清楚。但是需要指出，對于Netscape 1時代的基本HTML表，其表示僅用很簡單的一組規(guī)則就可以描述，如下（結(jié)果見圖11-10所示）。

table{border-collapse: collapse; border: 2px outset gray;}

td {border: 1px inset gray;}