SEO Packages

Creating Tables in Html

October 29, 2011EditorHTML, Web DesignComments Off

What’s an table, and what does it ? An table is an square text box for text or images.
You can use an table for lists and to make a well-organized text or image box.

Down below you got the code for the table:

<table border=”1″ cellpadding=”0″ cellspacing=”0″ style=”border-style:ridge; border-width:3; padding:0; border-collapse: collapse” bordercolor=”#3399cc” width=”500″ id=”AutoNumber1″>
<tr>
<td width=”20%”>Text 1</td>
<td width=”20%”>Text 2</td>
</tr>
</table>

Information about the layout and options of an table:
table border=”1″ 1 means that you get an black line around the table. You can set it to 0 for no line.
bordercolor=”#3399cc” This is the border color. This colors can be found in my color tutorial.
width=”500″ is the width of the table. You can make an small or an broad table.
td width=”20%” is the width of the text or image box.

The other things are not necessary for an normal and good working table. But i can hear you saying: How can i add text and make the table longer? That’s really easy:

This part:

<tr>
<td width=”20%”>Something here</td>
<td width=”20%”>And here also !!!</td>
</tr>

Is the text or image part. I use text here. You can see my example: “Something here” and “And here also !!!”. I got one row now with 2 words.

You can make more rows if you copy that part and put them under eachother. Example:

<td width=”20%”>Something here</td>
<td width=”20%”>And here also !!</td>
</tr>
<tr>
<td width=”20%”>Again text here !</td>
<td width=”20%”>Yes you can put also text here </td>
</tr>

Now you see, we got more rows. You can also put more words on one row. Example:

<td width=”20%”>Something here </td>
<td width=”20%”>And here also !!! </td>
<td width=”20%”>This is another word! </td> </tr>

Now we got 3 words one one row.

You can use all this parts separate and you can use them together. There are no limits. You can make the table as long as you want and you can also add unlimited words.

Related Posts

Comments are closed.