MMDT1021 Chapter 14 Notes - page 4

Controlling Space in and Around Cells

no cellspacing or cellpadding
Code Result
<table border="1">
  <tr>
    <td>column 1 row 1</td>
    <td>column 1 row 2</td>
  </tr>
  <tr>
    <td>column 1 row 2</td>
    <td>column 2 row 2</td>
  </tr>
</table>

 
column 1 row 1 column 2 row 1
column 1 row 2 column 2 row 2

 
cellspacing=10
Code Result
<table border="1" cellspacing=10>
  <tr>
    <td>column 1 row 1</td>
    <td>column 1 row 2</td>
  </tr>
  <tr>
    <td>column 1 row 2</td>
    <td>column 2 row 2</td>
  </tr>
</table>

 
column 1 row 1 column 2 row 1
column 1 row 2 column 2 row 2

 
cellpadding=10
Code Result
<table border="1" cellpadding=10>
  <tr>
    <td>column 1 row 1</td>
    <td>column 1 row 2</td>
  </tr>
  <tr>
    <td>column 1 row 2</td>
    <td>column 2 row 2</td>
  </tr>
</table>

 
column 1 row 1 column 2 row 1
column 1 row 2 column 2 row 2

 
cellspacing=10 cellpadding=10
Code Result
<table border="1" cellspacing=10
                  cellpadding=10>
  <tr>
    <td>column 1 row 1</td>
    <td>column 1 row 2</td>
  </tr>
  <tr>
    <td>column 1 row 2</td>
    <td>column 2 row 2</td>
  </tr>
</table>

 
column 1 row 1 column 2 row 1
column 1 row 2 column 2 row 2

 

Nesting One Table in Another

Code Page
<table><table></table></table> Result
Source

 

Changing a Cell's Color

Code Result
<table border="1" bgcolor="orange">
  <tr bgcolor="yellow">
    <td>column 1 row 1</td>
    <td>column 1 row 2</td>
  </tr>
  <tr>
    <td>column 1 row 2</td>
    <td bgcolor="red">column 2 row 2</td>
  </tr>
  <tr>
    <td>column 1 row 3</td>
    <td>column 2 row 3</td>
  </tr>
</table>

 
column 1 row 1 column 2 row 1
column 1 row 2 column 2 row 2
column 1 row 3 column 2 row 3

 

Using a Background Image

Code Result
<table border="1" background="coins.jpg">
  <tr>
    <td>column 1 row 1</td>
    <td>column 1 row 2</td>
  </tr>
  <tr>
    <td>column 1 row 2</td>
    <td>column 2 row 2</td>
  </tr>
</table>

 
column 1 row 1 column 2 row 1
column 1 row 2 column 2 row 2