[HTML][JavaScript][Computer Stuff][Freeing the
Mind]
Some other stuff on tables!
The following table probably covers everything you might reasonably want from a table.
It has;
- Colours
- Alignment
- Backgrounds
- Nested Tables
- Cell Padding
| I am spanning 3
rows! |
This is my table |
| I have some padding to keep me away from the
border! |
| Nested Table |
| The self known to me |
The self unknown to me and unknown by others |
| The self known to me and known by others |
The self unknown to me but known by others |
|
| Watching Television |
Playing sports |
View the code! (Although you might want to
wait a bit until you have read the rest of what follows!)
The first thing you might notice about the table is that it has a thick black border!
We achieve this effect by
<table width="95%" border="10" border="black"
name="table1" id="table1">
In the table tag we have the BORDER specified as 10 (I started
with 3 and increased the number till it looked right for me.) The bordercolor="black" is self evident (I remember when some book author said,
"This is self evident", no one, not even the research PhDs could work it out!
But here, I think it is self-evident! You put the colour name you want in the quotes or
use a hexadecimal code.)
You might also have noticed the cell on the left is sort of all by itself and
independent. (By the way, the little squares in the table are called cells.) What we do
here is to put <TD> in the first row and add to the <TD>
part;
<td rowspan="3" .. >
The ROWSPAN means that the cell <td> is spanning 3 rows
instead of keeping to its own row. Also the cell has a background image;
<td rowspan="3"
background="PinkBackground.gif" align="center"
width="20%">I am spanning 3 rows!</td>
See a simple example with code!
Also it has align="center"
which means that the horizontal alignment of the 'I am spanning 3 rows' is in the centre
rather than on the right or left. We would use valign had we wanted to centre it vertically.
The width="20%" means the left to right dimension of the cell is, in this
case, 20% of the table row width.
Let's look at aligning the contents of table cells! in
more detail!
[back to: tables]
[home][contents]
[on to: aligning the contents of table cells!]
Most Recent Revision: 18-Oct-98.
Copyright © 1998
I am always pleased to hear from you.
Send your comments to