Copyright © tutorialspoint.com
border-collapse determines the border model used in the rendering of a table.
Elements with a display of table or inline-table.
object.style.borderCollapse="Any of the two values"; |
Following is the example to show both values:
<style type="text/css"> table.one {border-collapse:collapse;} table.two {border-collapse:separate;} td.a { border-style:dotted; border-width:3px; border-color:#000000; padding: 10px; } td.b {border-style:solid; border-width:3px; border-color:#333333; padding:10px; } </style> <table class="one"> <caption>Collapse Border Example</caption> <tr><td class="a"> Cell A Collapse Example</td></tr> <tr><td class="b"> Cell B Collapse Example</td></tr> </table> <br /> <table class="two"> <caption>Separate Border Example</caption> <tr><td class="a"> Cell A Separate Example</td></tr> <tr><td class="b"> Cell B Separate Example</td></tr> </table> |
This will produce following result:
|
To Become more comfortable - Do Online Practice
Copyright © tutorialspoint.com