Tables : Basic
For Starters...
What are tables?
Tables are bascially a way to organize pictures, text, and other things neatly and evenly. If you go to my links (Resources) page, there is anexample of a table with all the affiliate buttons. That table has decoration, but basically what you do is define the number of rows and the number of columns and then it will render the table. A table with 3 columns and 4 rows, a border of 1, aligned center, a width of 300, and a space code in each cell will look like this:
Now, the code for all that looks like this:
<![CDATA[<table align="center" width=300 border=1>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>]]>
So, let's break it down:
the <![CDATA[<table ]]> is just opening the table tag, the <![CDATA[align="center" ]]>tag just means that I want the table to be aligned in the middle of the page. The <![CDATA[width=300 ]]>tag just means that I want the entire width of the table to be 300 pixels, you can also use % signs to signify how much of the page (or surrounding table) you want your table to take up. And finally, the<![CDATA[border=1> ]]>tag just means that I want my table to have a boreder of 1. You can add decoration to your tables, but we'll get into that later. Now, the <![CDATA[<tr>]]> tag means a table row, makes sense doesn't it, tr abbreviates table row. Then the <![CDATA[<td>]]> and <![CDATA[</td>]]> tags are table data or table column tags. And, yep, they specify how many columns you have in your table. Now, all the <![CDATA[ ]]> tag is is the HTML version of a space. When you hit the spacebar in Dreamweaver, for example, that's what it writes in the HTML part for you. But in Dreamweaver you can only put one space with the spacebar, after that you have to go in and change the HTML. But anyway, back to the tutorial. Without the space tag, your table would just look like a rectangle or a square. Not very exciting.You can make your tables have a border of 0, and you can make them any width and height you want, and then you can have tables within tables, and decoration, but this is pretty much it for the Tables : Basic tutorial, I hope it made sense to you. If you had trouble with it, please let me know through the contact page, the Shoutbox on the homepage, or the Forum, also on the homepage. |
