HTML Tutorial Lesson 9 : Creating a Table in HTML

[Lesson 8]<<[Contents]>>[Lesson 10]

Using HTML, you can use the table elements to create a table and displays the data on a web page.

9.1 Basic Table Elements

A table can be created using table element,  the row element tr and the column element td. The structure is as follows:

<!DOCTYPE html>
<html>
<head>
<title>Table</title>
</head>
<body>
<h1 align=center>Table</h1> 
<table>
<tr> <th>Thing</th> <th>Category</th></tr>
<tr> <td>Apple</td> <td>Fruit</td></tr>
<tr> <td>Cabbage</td> <td>Vegetable</td> </tr>
<tr> <td>Whale</td> <td>Mammal </td> </tr>
<tr> <td>Horse</td> <td>Mammal</td> </tr>
<tr> <td>Shark</td> <td>Fish</td> </tr>
<tr> <td>Mars</td> <td>Planet</td> </tr>
<tr> <td>Sun</td> <td>Star</td> </tr> </table>
</body></html>

 

Copy the codes above and paste them into your notepad. Save the file as table1.html.

The output is as follows:

Table

Thing Category
Apple Fruit
Cabbage Vegetable
Whale Mammal
Horse Mammal
Shark Fish
Mars Planet
Sun Star



[Lesson 8]<<[Contents]>>[Lesson 10]