細線表格的幾種做法（css）【經典推薦】
(一)效果一般
<style type="text/css">
<!--
table {border-collapse:collapse;}
td{
border-left:0;
border-top:0;
border-right:1px solid #00cd11;
border-bottom:1px solid #cb1122;
font-family:"Courier New", Courier, mono;
font-size:11px;
height:25px;
padding:0 12px 0 12px;
border-collapse:collapse;
}
.tdblue{
font-weight:bold;
color:#3C00C6;
}
-->
</style>
---------------------------------------
<table cellspacing="0" cellpadding="0">
<tr>
<td class="tdblue">Select My Menu</td>
</tr>
<tr>
<td>Who am I?</td>
</tr>
<tr>
<td>細線表格</td>
</tr>
<tr>
<td>Contact me</td>
</tr>
</table>
---------------------------------------
（二）推薦√√
<head>
<style>
table{
border-collapse:collapse;
border: 1px solid #000000;
}
td{
border-collapse:collapse;
border: 1px solid #000000;
}
</style>
</head>
<table>
<tr><td>123</td><td>132ssss</td></tr>
<tr><td>123</td><td>132sss</td></tr>
<tr><td>123</td><td>132</td></tr>
</table>
（三）推薦√
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>test4</title>
<style type="text/css">
table{border:1px solid #000;border-width:1px 0 0 1px;margin:2px 0 2px 0;text-align:center;border-collapse:collapse;}
td,th{border:1px solid #000;border-width:0 1px 1px 0;margin:2px 0 2px 0;text-align:left;}
th{text-align:center;font-weight:600;font-size:12px;background-color:#F4F4F4;}
</style>
</head>
<body>
<table width="236">
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</body>
</html>
---------------------------------------
（四）效果較好
定義ＣＳＳ檔案：
.thin{background:#000000}
.thin td{background:#FFFFFF;text-align:center}
TABLE設為：
<table border="0" cellspacing="1" cellpadding="0" class="thin">
---------------------------------------
附錄：用css設計細線表格並給表頭再加個框
(用CSS為<legnd>定義一個邊框)
不錯［還可參考教程中的另一些做法，下次補充］
<table width="200"" cellspacing="0" cellpadding="0">
<tr>
<td>
<fieldset style="width: 200; color: #B7B7B7; border-style: groove" align="center">
<legend style="color: blue; border: 1 solid #000000"> 表中表效果Ⅰ</legend>
<br>
</fieldset>
</td>
</tr>
</table>
border-collapse:collapse ：
table中css控制 css的border-collapse
<table width="100%" cellspacing="0" cellpadding="5" border="1" bordercolor="#0099CC" style="border-collapse: collapse;">
seperate 的邊框如下：
|| ||
|| ||
collapse 的邊框如下:
| | (兩個相鄰單元格的相鄰邊合併了)
說明
該CSS屬性用來設定表格的行和列的邊框是合併成單邊框，還是分別有各自的邊框
separate 預設值。邊框分開，不合並。
collapse 邊框合併。即如果相鄰，則共用同一個邊框。
雖然在DIV+CSS 時代 table 的權重越來越低，但是有時候，還是區域性地方table 還是挺好用的
特別是製表方面，還是table 比較的方便。
當然，製表肯定少不了邊框，但是如果你直接在td上加邊框，就會出現一種情況，table 的外圍一週是單線，裡面都是雙線。
你也可以通過其他分開設定的方法實現全部單線，但是這兒有一個最最簡單的方法，CSS 裡提供了 border-collapse 屬性可以控制相連邊框的合併還是分離
這樣就好多了