MMDT1021 Chapter 18 Notes - page 5

Dividing Your Table into Column Groups

Code Result 
<table border="1">
<colgroup align="right" style="font: 8pt Arial">
<colgroup span="2" align="center">
  <tr>
    <td>col 1 row 1</td>
    <td>col 2 row 1</td>
    <td>col 3 row 1</td>
  </tr>
  <tr>
    <td>col 1 row 2</td>
    <td>col 2 row 2</td>
    <td>col 3 row 2</td>
  </tr>
  <tr>
    <td>col 1 row 3</td>
    <td>col 2 row 3</td>
    <td>col 3 row 3</td>
  </tr>
</table>

col 1 row 1 col 2 row 1 col 3 row 1
col 1 row 2 col 2 row 2 col 3 row 2
col 1 row 3 col 2 row 3 col 3 row 3

Dividing Your Table into Horizontal Sections

Code Result 
<table border="1">
<colgroup align="right" style="font: 8pt Arial">
<colgroup span="2" align="center">
  <thead style="color: red">
  <tr>
    <td>col 1 row 1</td>
    <td>col 2 row 1</td>
    <td>col 3 row 1</td>
  </tr>
  </thead>
  <tbody>
  <tr>
    <td>col 1 row 2</td>
    <td>col 2 row 2</td>
    <td>col 3 row 2</td>
  </tr>
  </tbody>
  <tfoot style="font: 12pt Impact">
  <tr>
    <td>col 1 row 3</td>
    <td>col 2 row 3</td>
    <td>col 3 row 3</td>
  </tr>
  </tfoot>
</table>

col 1 row 1 col 2 row 1 col 3 row 1
col 1 row 2 col 2 row 2 col 3 row 2
col 1 row 3 col 2 row 3 col 3 row 3

frame=hsides
Code Result 
<table border frame="hsides">
<colgroup align="right" style="font: 8pt Arial">
<colgroup span="2" align="center">
  <tr>
    <td>col 1 row 1</td>
    <td>col 2 row 1</td>
    <td>col 3 row 1</td>
  </tr>
  <tr>
    <td>col 1 row 2</td>
    <td>col 2 row 2</td>
    <td>col 3 row 2</td>
  </tr>
  <tr>
    <td>col 1 row 3</td>
    <td>col 2 row 3</td>
    <td>col 3 row 3</td>
  </tr>
</table>

col 1 row 1 col 2 row 1 col 3 row 1
col 1 row 2 col 2 row 2 col 3 row 2
col 1 row 3 col 2 row 3 col 3 row 3

frame=vsides
Code Result 
<table border frame="vsides">
<colgroup align="right" style="font: 8pt Arial">
<colgroup span="2" align="center">
  <tr>
    <td>col 1 row 1</td>
    <td>col 2 row 1</td>
    <td>col 3 row 1</td>
  </tr>
  <tr>
    <td>col 1 row 2</td>
    <td>col 2 row 2</td>
    <td>col 3 row 2</td>
  </tr>
  <tr>
    <td>col 1 row 3</td>
    <td>col 2 row 3</td>
    <td>col 3 row 3</td>
  </tr>
</table>

col 1 row 1 col 2 row 1 col 3 row 1
col 1 row 2 col 2 row 2 col 3 row 2
col 1 row 3 col 2 row 3 col 3 row 3

frame=void rules=groups
Code Result 
<table border frame="void" rules="groups">
<colgroup align="right" style="font: 8pt Arial">
<colgroup span="2" align="center">
  <thead>
  <tr>
    <td>col 1 row 1</td>
    <td>col 2 row 1</td>
    <td>col 3 row 1</td>
  </tr>
  <tbody>
  <tr>
    <td>col 1 row 2</td>
    <td>col 2 row 2</td>
    <td>col 3 row 2</td>
  </tr>
  <tr>
    <td>col 1 row 3</td>
    <td>col 2 row 3</td>
    <td>col 3 row 3</td>
  </tr>
</table>

col 1 row 1 col 2 row 1 col 3 row 1
col 1 row 2 col 2 row 2 col 3 row 2
col 1 row 3 col 2 row 3 col 3 row 3