An HTML table is a structured set of data organized in rows and columns, designed to display information in a tabular format on a web page. The basic structure of an HTML table involves using the <table> element to define the table, <tr> (table row) elements to represent each row, `<th>` (table header) elements to define header cells, and <td> (table data) elements to represent data cells.
This is a basic illustration of an HTML table:
<!DOCTYPE html>
<html>
<head>
<title>Sample Table</title>
</head>
<body>
<table border="1">
<caption>Monthly Expenses</caption>
<tr>
<th>Category</th>
<th>Expense</th>
</tr>
<tr>
<td>Rent</td>
<td>$1,000</td>
</tr>
<tr>
<td>Utilities</td>
<td>$200</td>
</tr>
<tr>
<td>Food</td>
<td>$300</td>
</tr>
</table>
</body>
</html>
In this example:
- <table> Defines the table.
- <caption> Provides a title or description for the table.
- <tr> Represents a table row.
- <th> is used for header cells (typically bold and centered).
- <td> is used for data cells.
The border="1" attribute in the <table> tag is optional and is used to display borders around the table and its cells for better visualization. Keep in mind that modern web development often involves the use of CSS for styling, and styling tables can be achieved through CSS stylesheets rather than using the `border` attribute directly.