.
This is what the code looks like in your text editor before Netscape Navigator
reads it.|
Learning HTML is one of the easiest things to learn. Believe it or not, it's not really a programming language, but text with a few stupid codes. Have you ever used Wordperfect or Microsoft Word? If you understand how to use those little programs, you'd notice one thing. At the end of a paragaraph, you have that funny looking little backwards p. HTML is the same! |
Directory
|
How to read this page!
The stuff you pretend to type will be in a .
This is what the code looks like in your text editor before Netscape Navigator
reads it.
Whenever you see stuff in a 
,that is how the code
above it will be seen by the browser. In other words, it's the output of the
code, or the output of the stuff you typed (the red background above text).
All code has 
and 
brackets. You can spot code easily!
1. The Principles of Tables
All tables are built of two separate parts, rows and columns. Columns go up and down the page, whereas rows go across the page.
Understand that? Good! There's nothing else that needs to be understood! First, we'll look at setting up your table.
You begin your table by using the code, table.
Now, you can assign your variables, that go right into
table *here*. These are options, and not required.
| Variable | Example | Explaination of what happens |
| width | width=600 | My all-time favourite. Sets the width of the table to 600. This is in pixels. |
| border | border=2 | Creates a border around your table. This table has a border of 1, and you can set border=0 and have no border! |
| bgcolor | bgcolor=000000 | Sets the background colour of the table. If you don't have this option in, the background will automatically be the same as your body background. |
| cellpadding | cellpadding=5 | Puts some space between the letters in a cell and the cell walls. Default is 1. |
| cellspacing | cellspacing=10 | Puts space between each of the cells in the table. Default is 2. |
However, in order for the table that you will create to appear, you will
have to have an endcode, simply /table.
2. How to write the data into a table.
Now, we'll get down to the meat of it. Entering data. There are only 2 commands
required when making tables.
tr
which means TableRow, and
td
which means TableData. The only one that has to be closed off is
tr
by using an
/tr. Confused? Well, here's an...
Example:
|
table width=400 border=1
tr
td
This is my first apple
td
This is my second apple
/tr
tr
td
This is my first plum
td
My second plum
/tr
tr
td
I only have one orange
/tr
/table
|
Will look exactly like this:
| This is my first apple | This is my second apple |
| This is my first plum | This is my second plum |
| I only have one orange |
Notes on this example:
p and
/p for every paragraph.
center before the table begins and
/center after the table ends.
td's you want in a
tr. The browser sorts everything out. You could
have fifteen apples in one row!
3. tr
and td options
These options for the tr code can be also
used for the td code.
These options always go tr *here*.
| Code | usage | What the option does |
| bgcolor | bgcolor=000000 | Changes the background color of the row or piece of data |
| height | height=100 | Makes the row or data block 100 pixels high |
| width | width=60 | Makes the row or data block 60 pixels wide |
For td only:
| Code | usage | What the option does |
| colspan | colspan=2 | TableData takes up 2 columns. You can use any number |
| rowspan | rowspan=3 | Data takes up 3 rows, any number |
You should now understand Tables. Don't worry, with practice, you'll understand it no problems!
Get your own Free Home Page