HTML Tables

Creating Tables

Tables are used to display data in rows and columns. They consist of table rows (<tr>) containing table headers (<th>) or table data (<td>) cells.

Tables should be used for tabular data, not for page layout.

<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Age</th>
      <th>City</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>John</td>
      <td>25</td>
      <td>New York</td>
    </tr>
    <tr>
      <td>Jane</td>
      <td>30</td>
      <td>London</td>
    </tr>
  </tbody>
</table>
  • <table> - Defines a table
  • <thead> - Table header section
  • <tbody> - Table body section
  • <tr> - Table row
  • <th> - Table header cell
  • <td> - Table data cell

Try Tables

<h2>Student Grades</h2>
<table border="1" cellpadding="10">
  <thead>
    <tr>
      <th>Student</th>
      <th>Subject</th>
      <th>Grade</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Alice</td>
      <td>Math</td>
      <td>A</td>
    </tr>
    <tr>
      <td>Bob</td>
      <td>Science</td>
      <td>B+</td>
    </tr>
  </tbody>
</table>

Note: Use CSS to style tables instead of HTML attributes like border and cellpadding.