HTML Tutorial |
Lesson 6 | ||||
Home Introduction to HTML <html> to </html> <body> to </body> Formatting Links Backgrounds Tables Frames Other tags A little Style Resources |
• Tags covered in this lesson: • Explanation: • Working examples: Tags covered in this lesson: Tables kept me confused for a long time. I just couldn't understand the HTML structure. Then one day I just sat and kept looking at it. Now I think I can put it in clear and consice words for you: Tables are designed one row at a time. If you have got 20 columns and 5 rows then, you will first build 20 cells of one single row, fill it with whatever you want, then start building the next row. This way you will build one row, 20 horizontal cells at a time. This is how we do it: <html> <head> <title>This is my First html Page</title> </head> <body bgcolor="#ffffff"> <h1>My First Page</h1> <p>This, as the <i>title</i> suggests is my <b>First Page</b>.</p> <p>I am learning HTML and am going to master it.</p> <p>Teach me <u>more</u>.</p> <table border="1" cellpadding="0" cellspacing="0" width="500" > <tr> <td> </td> <td> </td> </tr> </table> </body> </html> Save and view it in the browser. What do you see? First let us understand what we have typed. '<table border="1" cellpadding="0" cellspacing="0" width="500" >' informs the browser of the beginning of a table. '<tr>' begins the "Table Row". '<td>' is "Table Data". All that you want to place in the table goes between '<td> and </td>' tags. '</td>' and '</tr>' end a table data and a table row respectively. '</table>' ends the table. Now, let's go to the beginning and check "border". Border is the table border. You can decide the border of the table. If used with proper imagination it can create a beautiful page for you. Try it. Cellpadding is the distance between the wall of the cell and the text in the cell. Cellspacing is the distance between two cells. If you have a large image you want to put on a page, you can cut down the download time of the image by cutting it into smaller pieces and placing those pieces in a table. By keeping the cellspacing "0" you remove all spaces between the cells. So, the images will look like one image. Now, write something between '<td> and </td>'. Save and view in the browser. What do you see? That is all for tables. Mine is to teach and yours is to practice. So practice. • FirstPage10.html |
Home | Introduction to HTML | <html> to </html> | <body> to </body> | Formatting | Links | Backgrounds
Tables | Frames | Other tags | A little Style | Resources |