Creating Table Using Html Code

Well, now i'd like to discuss about How To Create A Table On Blogger?. This is not something hard at all, you can create it by only using Html Code. You can create a single column, two columns, three, four, or just as many columns as you mean to create. Let's just practice it. Pay attention on the below.

<table> <tr> <td>This is a single column table</td> </tr> </table>

The above code will generate the following form.

This is a single column table

It is the basic form of table, and if you think it's not like a table, then it must be cuz you don't see like it has a frame. There are two ways that you can make to frame it, by using attribute frame or adding border around the table. I myself preffer to add border than to use attribute Frame. Here we go.

Using Attribute Frame

<table frame="border"> <tr> <td>Example table with attribute Frame</td> </tr> </table>

The above code will generate the following table.

Example table with attribute Frame

Attribute frame has a various values.

border= frame table with two horizontal line (up and bottom side) and two vertical line (right and left side)
box= the same with the above.
void= no frame (means no line)
above= horizontal line on up side.
below= horizontal line on down side.
hsides= horizontal line on up and down side.
vsides= vertical line on right and left side.
lhs= i forgot it.
rhs= i forgot it.

Using Attribute Border

<table border="1"> <tr> <td>Example table using attribute border</td> </tr> </table>

The above code will generate the following form.

Example table using attribute border

All above is belong to standard form. Below we'll discuss How To Create Two Or More Columns and what Attributes Can Be Used With

Attributes

There are some attributes that you can use to form your table more perfectly. Here they are.

Cellpadding= defines range betwen content and border.
Cellspacing= defines range betwen contents.
align= defines table position.
rowspan="number value"= defines how many rows on one column (used together with tag <th>)
colspan="number value"= defines how many columns on one column (used together with tag <th>)
width= defines table width.
height= defines table height.
bgcolor= defines table background color.

Maybe there are some more attributes that you can use, but the above are the most oftenly used.

Creating Table with Two or More Columns

Spans With Two Cols

<table border="1" cellpadding="5" align="center"> <tr> <th>Name</th> <th colspan="2">Email/Phone</th> </tr> <tr> <td>John Smith</td> <td>the_great_smith@gmail.com</td> <td>62856532156486</td> </tr> </table>

The above code will generate the following table.

Name	Email/Phone
John Smith	the_great_smith@gmail.com	62856532156486

Spans With Two Rows

<table border="1" cellpadding="5" align="center"> <tr> <th>Name</th> <td>John Smith</td> </tr> <tr> <th rowspan="2">Email/Phone</th> <td>the_great_smith@gmail.com</td> </tr> <tr> <td>2856532156486</td> </tr> </table>

The above code will generate the following table.

Name	John Smith
Email/Phone	the_great_smith@gmail.com
	2856532156486

I'm sure you can explore the above code to create as many columns as you want, can't you?

Table Inside Table

You can also put a table inside a table. Here is an example.

<table border="1" cellpadding="5" align="center"> <tr> <th>Name</th> <td> <table border="1" cellpadding="0"> <tr> <td>John Smith</td> <td>Eva Sugondo</td> </tr> </table> </td> </tr> <tr> <th rowspan="2">Email/Phone</th> <td>the_great_smith@gmail.com</td> </tr> <tr> <td>2856532156486</td> </tr> </table>

The above code will generate the following table.

Name	John Smith Eva Sugondo
Email/Phone	the_great_smith@gmail.com
	2856532156486