TABLES
Tables in Action
Tables allow us to display information in columns, much as tables are used in word processing. We have the added feature of turning off borders. Tables are a little tricky to code at first...
Create your table on paper first - it will be much easier to "code"!
HTML tables have:
rows -- horizontal
columns -- vertical
cells -- the intersection of a row and column
Tables must have the same number of cells in each table row.
Borders can be visible or transparent and can vary in thickness.
|
Example
|
|
This Table has 3 rows and 2 columns:
Border of 2
Cellpadding of 2
Cellspacing of 2
|
|
<table border="1">
<tr>
<tr>1st Row & 1st Column</tr>
<tr>1st Row & 2nd Column</tr>
</tr>
<tr>
<td>2nd Row & 1st Column</td>
<td>2nd Row & 2nd Column</td>
</tr>
<tr>
<td colspan="2">Third Row & Combined Column</td>
</tr>
</table>
|
|
1st Row & 1 Column
|
1st Row & 2nd Column |
| 2nd Row & 1st Column |
2nd Row & 2nd Column |
| 3rd Row & Combined Column |
|
Tips
You can create a blank cell:
<td><br></td> or <td> </td> OR
you can have a cell "span" several columns to equal the same number of cells per row.
<td colspan="2">
Sometimes you want to have more than one line of text in a cell. Since browsers ignore the ENTER key, you break the line by adding <br> where you want the line to stop.
You may not want the text to appear on more than one line - not wrap to the next line.
Add a <th nowrap>……</th> or <td nowrap>…..</td> tag
Return to the Top
|
