CSS allows you to define the style, width and color for the table elements, similar to any kind of boxes. It can be done using
border-style,
boder-width,
border-color or
border properties.
Note
The
<tr> elements are rendered without a border.
The style defined for a
<table> element doesn't apply to its children.
The style defined for
<tr> elements applies to the
<td> elements. (only internet explorer)
snippet
<html>
<head>
<style>
td {border:1px solid gray;}
.none {border-sty;e: none}
.hidden {border-style: hidden}
.dotted {border-style: dotted}
.dashed {border-style: dashed}
.solid {border: 1px solid red;}
.double {border-style: double}
.groove {border-style: groove}
.ridge {border-style: ridge}
.inset {border-style: inset}
.outset {border-style: outset}
</style>
</head>
<body>
<table>
<tr><td class="none">none</td><td class="hidden">hidden</td></tr>
<tr><td class="dotted">dotted</td><td class="dashed">dashed</td></tr>
<tr><td class="solid">solid</td><td class="double">double</td></tr>
<tr><td class="groove">groove</td><td class="ridge">ridge</td></tr>
<tr><td class="inset">inset</td><td class="outset">outset</td></tr>
</table>
</body>
</html>
