Some cookies are necessary to make this site and our content available to you. Other Cookies enable us to analyse and measure audience and traffic to the site. Cookies are also used by us, advertisers, ad-tech providers and others to develop and serve ads that are more relevant to your interests. To consent to the use of Cookies and proceed to the site, click Accept below. If you wish to withdraw consent later you will find a link in the footer Cookie Choices. For more information: Privacy Policy.

Lesson 10 - Tables

Tables are a great way to divide a page and organise how your page looks. A table is basically a grid made up of columns and rows. Each little box is called a cell. Your text, pictures, or whatever you'd like to post goes inside the cells.
To create a table, you need to start and end it. To start a table, you have to type <table>, and to end the table, type </table>. What goes between the start and end tags depends on what type of table you want. Every table has at least one row. A table row is one horizontal row made up of x number of table data cells. It is completely up to you what you put into each cell. You can enter text, images, links...anything you'd like. If you want to create a table with two columns and one row, you need to type:

<table>
<tr> - start table row
<td> - start table data cell
type your text or image tags here
</td>
<td> - start the second table data cell
type your text or image here
</td>
</tr>
</table>

It will now look like this:

This is the first data cell... ...and this is the second. Woo hoo I have created my first table!

You can have any number of table rows and data cells, as long as you remember to end each tag. The main thing to remember is to start with a <tr>. Adding extra <tr>'s will add extra rows, and adding extra <td>'s will create an extra cell. If you want to add an extra cell or row, make sure you end the one before it before starting a new one.

Go to Previous Lesson Go to Next Lesson