You're probably dying to know what all those nifty attributes do. Well, I'm going to tell you. The BORDERCOLORLIGHT and BORDERCOLORDARK attributes control the border colour [who wold have thought?]. If you make them the same colour [like black], and then reduce the CELLSPACING to "0" [zero], then you get a table kind of like the one you see on this page [remember that my BORDER attribute is set to "3"]. What the CELLSPACING attribute does is tell you how much space [in pixels] there is between cells [that space shows up inside the borders, which is why you have to set it to "0" in order to get a solid border like mine]. And if you don't set the two colour attributes to the same thing, then the browser will render a sort of psuedo drop-shadow around the table, making it look three dimensional.

We've already dealt with the HEIGHT, WIDTH, and ALIGN attributes in other tags, so you already know how they work [horizontally - same as paragraphs]. All that really leaves, is CELLPADDING.

CELLPADDING is the space inside each cell, between the content of the cell and the wall of the cells. Normally, it's set to "0" [zero], meaning that there are no pixels between the first character/image in the cell. If you want a little space, set it higher. That's all there is to it.

Since we're on the subject of cells, I should probably mention that you can do certain formatting tricks to the cells themselves. You can, for example, set the background for an individual cell the same way you set the background for the whole table [it works for individual rows as well], by putting the BGCOLOR attribute inside the tag.

You can also adjust the vertical alignment of the content of a given cell. If you set the height of a table in pixels, then the content of that table's cells will render in the middle, that being the default choice. If you want it to start at the top [or maybe at the bottom], you can use the VALIGN attribute in the TD tag. Set it to either top, bottom, or middle. You may ask why I'm suddenly using lower-case for the VALIGN attribute. This is because I have found that for some reason [don't ask me why - and I haven't heard anyone else comment on this, so maybe it's just a bug on my system] any alignment attribute seems to work better in lower-case. I just don't know.

I think that's about it for HTML for this tutorial. Next we're going to move on to a few basic principles you should keep in mind when designing for the web.

Or, if you are ready to jump right in, check out the psuedo homework assingment. Can you figure out how everything was done, based on the content of this tutorial?