Hiya, there.
To start off, this tutorial will deal mainly with tables. I suggest you view our Intro To HTML tutorial before you do this one. Unless, of course, you already have a basic understanding of HTML. Yes, Crystal decided that since people seem to like table layouts, she'd make this tutorial. Now I'm going to warn you, that this is going to be hard and confusing if you don't know anything about HTML.
Well, in case you just randomly clicked here, this should be about what you can make after a bit of practice. Of course, there is some graphic skill and styling involved in that that I will not be teaching today, but you will be able to make the tables.
First of all, a table is a place where you can put content. It's really what forms an HTML document - everything revolves around tables.
To get a table, the most basic code you can imply is:
Right? Well, then, say you wanted two tables, that sit side-by-side, or a double-celled table. Each "table" is a cell that is inside a big table. So, to do this the code would look like this:
You can add as many td's, or cells, as you'd like.
Now, you may notice that the table expands as far as it needs to to fit the text inside it. I know, you want the table to be a certain height and width. And you probably want it to scroll =/
So, let's just focus on one table for now. In the table element you might want to specify a width and height. It also does work in the td, and it's what I usually do.
You can play around with the width and height.
Now, you probably also want backgrounds, borders, etc.
So, to do this you will have to add other tags in your table tag. For example, to get a solid color background you will have to add a,
Onto your original code, so that it looks like this:
Of course, you need to know color codes to change the color of the one in the table. The code up there looks like this:
Table text here
Cool, huh? Let's see if we can change the width and height of the table.
Table text here
The following code created the above table:
So, now, maybe you want to specify a color for the border. To do that you'll need;
Again, try playing around with it. You'll need to know colors to change the border color as with the background.
Now, let's say you made a background. And you want it to become the background of your table.
Blah blah blah xD
The table used the code;
Of course, you can play with the code. Now, suppose you want to color your border.
Text text text xD
The table used the code;
And always, always, to add more cells just increase the number of td's =D
Done deal!
Why are you still here?
Stop reading. Go away.
I said go away!
Yeah, I'm teasing you. Or not.
So, those were actually tables in basic. If you want to learn more, there's another tutorial I'm writing that will clear things up a whole lot ;]
Be sure to check it out!
