border-collapse

Overview

W3C

Properties

background

background-attachment

The border-collapse property selects a table's border model.

CSS2


                                border-collapse: collapse | separate | inherit

Initial:	separate
Applies To:	table and inline-table elements
Inherited:	yes
Percentages:	NA
Media:	visual

DOM
Example | collapse
Example | separate
Example | DOM
Reference


                                [window.]document.getElementById("element-id").style.borderCollapse = "border-collapse";

<!doctype html>
<html>
  <head>
    <title>border-collapse</title>
  </head>
  <body>
    <a href="/" onmouseover="mouseover1();">separate</a>
    <a href="/" onmouseover="mouseover2();">collapse</a>
    <table id="id1">
      <tr>
        <td id="id2">cell 1</td>
        <td id="id3">cell 2</td>
      </tr>
      <tr>
        <td id="id4">cell 3</td>
        <td id="id5">cell 4</td>
      </tr>
    </table>
  </body>
  <script type="text/javascript">
    function mouseover1() {
      document.getElementById("id1").style.borderCollapse = "separate";
    }
    function mouseover2() {
      document.getElementById("id1").style.borderCollapse = "collapse";
    }
    document.getElementById("id1").style.border = "solid 1px";
    document.getElementById("id2").style.border = "solid 1px";
    document.getElementById("id3").style.border = "solid 1px";
    document.getElementById("id4").style.border = "solid 1px";
    document.getElementById("id5").style.border = "solid 1px";
  </script>
</html>

W3C Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification

CSS

DOM

Example | collapse

Example | separate

Example | DOM

Reference