Logo of aks.htmlplanet.com

Links
Play Intro
New Stuff
Home
Poems
Jokes
Quotes
Wallpapers
Learn HTML
-Getting Started
-What are tags ?
-Hex Codes
-Body Tag
-Font Tag
-Useful Tags
-Tables
--->Tables Part II
--->Tables Part III
-Adding Images
-Linking Pages
-Adding Sounds
Suggestion Book







































DigiArc :: Owned By Aakash Ashvin Shah
 .:: Welcome to aks.htmlplanet.com !





 .:: Learn HTML > Tables Part II ...


.:: Here we would start with 'Colspan'. In the previous chapter 'Tables' we saw the example of writing the different colors in the form of a table. The other way is as follows :

.:: Colspan

Colors
RedGreenBlue


Now you see that the cell in which 'Colors' is written actually occupies the space of 3 cells ! You can always know it by watching the next row of cells. It's code is as below :

< Write all the codes till the end of the head tag >
< body bgcolor="#CCCCCC"(gray) >
< table border="1" cellspacing="0" cellpadding="0" width="200" >
< tr >
< td colspan="3" >Colors< /td >
< /tr >
< tr >
< td >Red< /td >< td >Green< /td >< td >Blue< /td >
< /tr >
< /table >
< /body >
< /html >

.:: Now, the colspan means the span of columns which is 3 here. This '3' was predetermined because I knew that in the next < tr > i.e. in the next row there are going to be 3 cells.
Notice that after writing < tr colspan="3" >, I didn't write the td tag another 2 times. While in the next row where colspan was not written I had to write the td tag 3 times. It would be more clear with another example :

Primary Colors
RedBlueGreen
Other Colors
VioletOrangePink


.::Try guessing the code of the above. Check it below :

< table border="1" cellspacing="0" cellpadding="0" width="200" >
< tr >
< td colspan="3" >Primary Colors< /td >
< /tr >
< tr >
< td >Red< /td >< td >Green< /td >< td >Blue< /td >
< /tr >
< tr >
< td colspan="3" >Other Colors< /td >
< /tr >
< tr >
< td >Violet< /td >< td >Orange< /td >< td >Pink< /td >
< /tr >
< /table >

.:: We would learn 'Rowspan' in the next chapter : Tables PART III.


Learn HTML > Tables > Tables Part II






 .:: Buck Up ! You can do it !