Specifies the spacing between adjacent cell borders
Description
If you do use the default separate value for the border-collapse property, you can use some additional properties to refine the appearance.
The border-spacing property defines the amount of space that will be drawn between the borders of adjacent elements.
Example
<!DOCTYPE HTML>
<html>
<head>
<style>
table {<!-- w w w . ja va 2s . co m-->
border-collapse: separate;
border-spacing: 10px;
}
th, td {
padding: 2px;
}
</style>
</head>
<body>
<table border="1">
<caption>Results of the Survey</caption>
<colgroup id="colgroup1">
<col id="col1And2" span="2"/>
<col id="col3"/>
</colgroup>
<colgroup id="colgroup2" span="2"/>
<thead>
<tr>
<th>Rank</th>
<th>Name</th>
<th>Color</th>
<th colspan="2">Size</th>
</tr>
</thead>
<tbody>
<tr>
<th>Favorite:</th>
<td>C</td>
<td>B</td>
<td>A</td>
<td>Q</td>
</tr>
<tr>
<th>2nd Favorite:</th>
<td>W</td>
<td>W</td>
<td></td><td></td>
</tr>
</tbody>
<tfoot>
<tr>
<th colspan="5">© 2011 java2s.com Data</th>
</tr>
</tfoot>
</table>
</body>
</html>