WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You

WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You


You are not connected. Please login or register

View previous topic View next topic Go down  Message [Page 1 of 1]

1Accespted Quick table tutorial Thu Mar 25, 2010 1:35 am

Unknown Data

Unknown Data
Registered Member
Registered Member

Quick table tutorial
How to make tables



Step One ~ A normal table
The most normal Tables are just 2 cells side by side, that is a relly easy code and look like this.
Tip: If you leave the colors blank and make the "Table Border" 0, the table will be invisible.

<table border="1" bordercolor="#Here goes background color" style="background-color:#Here goes frame color" width="How long in pixels" cellpadding="3" cellspacing="3">
<tr>
<td>1. Table Cell</td>
<td>2. Table Cell</td>
</tr>
</table>

Step Two ~ More Cells
You can add tons of cells under eachother, by put the code marked with red in were I put it.

<table border="1" bordercolor="#Here goes background color" style="background-color:#Here goes frame color" width="How long in pixels" cellpadding="3" cellspacing="3">
<tr>
<td>1. Table Cell</td>
<td>2. Table Cell</td>
<tr>
<td>3. Table Cell</td>
<td>4. Table Cell</td>

</tr>
</table>

And if you want more cells side by the other cells, you put this code in were I put it agian.

<table border="1" bordercolor="#Here goes background color" style="background-color:#Here goes frame color" width="How long in pixels" cellpadding="3" cellspacing="3">
<tr>
<td>1. Table Cell</td>
<td>2. Table Cell</td>
<td>3. Table Cell</td>
<td>4. Table Cell</td>

</tr>
</table>

Step Three ~ Cellpadding and cellspacing
All right, now i just learn you what these two things are, it would be very quick.
The "cellpadding" is how much place there would be between the text/image and the tables outlines.
The "cellspacing" is how muck place there would be between the outlines and the frame.
Tip: High numbers make it larger and smaller numbers will make them smaller.

Step Four ~ Left, right or center?
This is the last part, under the text here is the code changed a little bit, it's there you chose which side the table would be, if you write "Left" it would be in the left side, if you write "Right" it would be in the right side and if you write "Center" it would be in the center.

<table border="1" bordercolor="#Here goes background color" style="background-color:#Here goes frame color" width="How long in pixels" cellpadding="3" cellspacing="3" align="[Where on the document]">
<tr>
<td>1. Table Cell</td>
<td>2. Table Cell</td>
</tr>
</table>

Notice : This tutorial is copyrighted by WebArtz Forum. You may not publish it on anywhere without written permission from the administrators.

http://woops.dk

2Accespted Re: Quick table tutorial Fri Mar 26, 2010 12:44 am

Sanket

Sanket
Administrator
Administrator
Tutorial Accepted | Moved to Tutorial Section

Thank you for your contribution to WebArtz, its appreciated Smile

http://www.webartzforum.com

3Accespted Re: Quick table tutorial Fri Mar 26, 2010 3:41 am

Matti

Matti
Registered Member
Registered Member
Thanks for this tut, this is just what I need. Smile

http://csshelp.forumotion.net/

4Accespted Re: Quick table tutorial Sat Mar 27, 2010 7:25 am

Jophy

Jophy
Registered Member
Registered Member
Nice tutorial Unknown Data, it's greatly appreciated Smile

http://www.socialtechforum.com/

5Accespted Re: Quick table tutorial Sat Mar 27, 2010 7:11 pm

ankillien

ankillien
Administrator
Administrator
Nice tutorial mate Very Happy
This explains most commonly used table attributes.

Sponsored content


View previous topic View next topic Back to top  Message [Page 1 of 1]

Permissions in this forum:
You cannot reply to topics in this forum