GREAT HTML TABLES - FOR BLOGGER, WORDPRESS, JOOMLA, PROJECTS.

By: Unknown 0 comments

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Table 1: Simple Table

Demo:

Each table starts with a table tag. Each table row starts with a tr tag. Each table data starts with a td tag.

One column:

100

One row and three columns:

100

200

300

Two rows and three columns:

100	200	300
400	500	600

CODE: Get its code

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Table 2: Tables Without Borders

Demo:

This table has no borders:

100	200	300
400	500	600

And this table has no borders:

100	200	300
400	500	600

CODE: Get its code

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Table 3: Table Header

Demo:

Table headers:

Name	Telephone	Telephone
Bill Gates	555 77 854	555 77 855

Vertical headers:

First Name:	Bill Gates
Telephone:	555 77 854
Telephone:	555 77 855

CODE: Get its code


--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Table 4: Table with a Caption

Demo:

Monthly savings

Month	Savings
January	$100
February	$50

CODE: Get its code

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Table 5: Table cells than span more than one row/column 

Demo:

Cell that spans two columns:

Telephone

Name

Bill Gates
555 77 854
555 77 855

Cell that spans two rows:

Telephone:

First Name:	Bill Gates

555 77 854
555 77 855

CODE: Get its code

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Table 6: Tags inside a table

Demo:

This is a paragraph This is another paragraph	This cell contains a table: A B C D
This cell contains a list apples bananas pineapples	HELLO

CODE: Get its code

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Table 7: Cell padding (controls white space between text and borders)

Demo:

Without cell padding:

First	Row
Second	Row

With cell padding:

First	Row
Second	Row

CODE: Get its code

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Table 8: Cell spacing (controls space between cells)

Demo:

Without cellspacing:

First	Row
Second	Row

With cellspacing="0":

First	Row
Second	Row

With cellspacing="10":

First	Row
Second	Row

CODE: Get its code

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------