How to create a basic table in an HTML page

HTML Table Element

In HTML, table element is used to create an HTML table in a webpage.

HTML tables are used to display data in a tabular format in a webpage.

How to Create an HTML Table

Create an HTML <table></table> element

Add three <tr></tr> table rows inside the table element.

Add three <th></th> table header inside the first <tr> (table row) element. Add "Name", "Gender", and "Age" as header text in <th> elements.

Add three <td></td> (table data) elements inside the second as well as third <tr> (table row) elements.

Add data to the <td> (table data) elements as shown in the following example:

Please note that we are not using any CSS style to decorate the table. A simple table will be created.

Example of HTML Table


Output of the above code example

Example of Table in a Webpage


Name Gender Age
Alice Jonathon Female 15
Peter Parker Male 16

In the above example, data have been presented in a tabular format. But the table does not have any border.

Learn how to add border to an HTML table.

Live Code Playground

In the following HTML code editor, you can practice the above code by adding more table row and data. Click on the 'Run Code' button to render the code; the rendered page will be displayed in the following HTML Code Output frame. Practice until you become comfortable and proficient with your code.

HTML logo HTML Online Editor
HTML Code Output