大家都知道在HTML中當border="1" cellpadding="0" cellspacing="0" 的時候，表格樣式很醜，有點“立體”的感覺，當改變邊框顔色的時候，border看起來又會很粗，這是因為兩個邊重疊所造成的，那麼如何做出上面的效果呢？跟着我的操作來吧。
代碼
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表格樣式</title>
</head>
<body>
<table border="0" cellpadding="5" cellspacing="1" width="100%" align="center" style="background-color: #b9d8f3;">
<tr style="text-align: center; COLOR: #0076C8; BACKGROUND-COLOR: #F4FAFF; font-weight: bold">
<td><font size="2">新聞标題</font></td>
<td><font size="2">連結位址</font></td>
<td><font size="2">釋出時間</font></td>
</tr>
<tr align="center" bgcolor='#F4FAFF'>
<td nowrap="nowrap">百度首頁</td>
<td><font size="2">http://www.baidu.com</font></td>
<td><font size="2">2010年3月22日 13:23:28</font></td>
</table>
</body>
</html>
從上面可以看出，我們真正用到的并不是border，而是背景顔色（BACKGROUND-COLOR）和外邊距(cellspacing) 這兩個屬性（代碼中高光部份），思路上有些像Photoshop裡“層”，用上面的“層”減掉“背景層”得到的就是現在大家看到的效果。背影顔色（主）就是我們最後的邊框的顔色，我們看到的邊框實際上是通過cellspacing的縫隙看到的背景色，因為我們設定了邊距是1px，是以看上去像是border。
說的有點亂，希望大家能看明白。