Tables
Creating A Basic Table
Tables are another area where HTML is just like plain
English. You just need to remember that they are organized
in rows, which go horizontally from left to right.
We'll start by creating a basic table in HTML, then we'll
modify it and discuss ways you can use your newly acquired
skills.
Start by creating a new HTML document -
<HTML>
<HEAD>
<TITLE>My First Table</TITLE>
</HEAD>
<BODY>
Now, you tell the browser that you want it to draw a
table for you, like this -
<TABLE>
See, I told you it was just like plain English!
Next, you should add a caption to your table - that is
the title above the table, telling people why you have a
table on your page.
<CAPTION>My First Table</CAPTION>
As I said in the first paragraph, tables are made up of
rows which go from left to right. So let's create your first
row -
<TR>
<TR> stands for table row, making it easy to
remember.
Next, you start adding in the individual cells or
sections of your table. For the first row, you will want to
add in headers or titles telling what the stuff below them
is for.
<TH>Colors</TH>
<TH>In A Rainbow?</TH>
<TH> stands for table header, again making it easy
to remember.
Since that is all we'll be having in our first row, you
need to close out the row tag like this -
</TR>
Start another row -
<TR>
And in this row, you'll begin putting in the actual data
for the table - otherwise known as the stuff underneath the
headers.
<TD>Red</TD>
<TD>Yes</TD>
</TR>
<TD>
stands for table data - not as easy to
remember as the others, but still, it does make some sense.
And, as you can see, you ended that row with the </TR>
tag.
Before I let you loose to try it, you should temporarily
close the tags on the page, save it and take a look. To do
that -
</TABLE>
</BODY>
</HTML>
And name it "test7.htm" - be sure and return
when you are finished admiring your page.
Now, look back up to where we added in the row about red.
It has four lines to it -
<TR>
<TD>Red</TD>
<TD>Yes</TD>
</TR>
Every other row in this table will have those same four
lines, with just "Red" and "Yes"
changing. Why do I mention this? Because you, yes you, are
now going to go back and add in rows for the other colors in
the rainbow - orange, yellow, green, blue, indigo, violet.
Since they are all "Yes" to whether they are in
the rainbow or not, you just need to change "Red"
to the next color for each row.
When you are finished with that, come on back and move
on to the next step.
