The border-collapse property (CSS Reference)
Introduction
The border-collapse property is used to make the border
collapse. This has a big influence on the look and style of the table cells.
The following example demonstrates the usage.
Example
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>border-collapse
Demonstration</title>
</head>
<body>
<table
border="1" style="border-collapse: collapse" bordercolor="#111111"
width="500"
height="154">
<tr>
<th
colspan="3">collapse</th>
</tr>
<tr>
<td
align="center">1</td>
<td
align="center">2</td>
<td
align="center">3</td>
</tr>
</table>
<br/>
<table
border="1" style="border-collapse: separate"
bordercolor="#111111" width="500"
height="154">
<tr>
<th
colspan="3">separate</th>
</tr>
<tr>
<td
align="center">1</td>
<td
align="center">2</td>
<td
align="center">3</td>
</tr>
</table>
</body>
</html>
Output
Values
|
Name:
|
Description:
|
|
collapse
|
This value means that the complete table shares the one
border. It doesn’t contain any internal border as used in normal borders. The
above screenshot demonstrates this.
|
|
separate
|
The separate value means that the table has a separate
inner and a separate outer border.
|
|
Email TopXML