HTML DOM Style Object Table Properties
What are all the table properties available in the style object?
Explanation
HTML DOM Style Object Table Properties:
The table property is used to set the various values to the table at runtime.The table properties of the style object were listed in the table given below:
syntax:
object.style.
property=
value Table Property | Description | values |
borderCollapse | specifies whether the table border should be collapsed into a single border or detached as in standard HTML | separate collapse |
borderSpacing | specifies the distance between cell borders | length |
captionSide | specifies the position of the table caption | top bottom left right |
emptyCells | specifies whether to show empty cells in a table or not | hide show |
tableLayout | specifies the rules used to display the table cells, rows, and columns | automatic fixed |
Set the various values listed in the above table to the corresponding table property.
Example <html>
<head>
<script type="text/javascript">
function BorderCollapse()
{
document.getElementById('Table').style.borderCollapse="collapse";
}
</script>
</head>
<body>
<table border="1" id="Table">
<tr>
<td>red</td>
<td>green</td>
</tr>
<tr>
<td>pink</td>
<td>violet</td>
</tr>
</table>
<br />
<input type="button" onclick="BorderCollapse()" value="Collapse">
</body>
</html>
Result: