Course Content
Ultimate HTML
Tables are helpful in presenting complex relationships by placing content in cells. They are ideal for tabular data such as transport timetables, calendars, salary compensations, match results, financial transactions, restaurant menus, price lists, and other information naturally presented in a tabular format, such as Google Sheets.
Here are the main elements used to create tables in HTML:
<table>
- defines a table on a web page.<tr>
- defines a row within the table.<th>
- defines a header cell within a row. Header cells are typically bold and centered.<td>
- defines a standard data cell within a row.
Let's create the markup for this menu.

How to make it:
index.html
index.css
index.js
Sections
To create the semantically correct markup we need to follow the next section structure. Not all of these sections are required for all tables.
<thead>
- specifies header. It wraps the column headings;<tbody>
- specifies body. It wraps the main table content;<tfoot>
- specifies footer. It wraps the group of table rows in the footer area;
The result code:
Column heading
To create a row we use <tr>
tag. Between opening and closing <tr>
we use <th>
tag for each heading. The result code:
Column Content
Each row we wrap with help of <tr>
tag. Inside of opening and closing <tr>
tag we use <td>
to put data for each column.
The result code:
Note
By default, HTML tables do not have any unique design. All styles we have to add manually with the help of the CSS
What is the HTML element used to define a table on a web page?
Select the correct answer
What HTML element is used to define a row within a table?
Select the correct answer
What is the purpose of the <th>
element in an HTML table?
Select the correct answer
Section 4.
Chapter 5