Working with a table in HTML simplified.

Tables are like the superheroes of organizing information on a webpage. Imagine neatly arranging data in rows and columns—perfect for displaying everything from schedules to product details. In HTML, creating tables is a breeze, and I'll guide you through the basics.

Creating a Table

To start, use the <table> tag to signify the beginning of your table. Inside this tag, you'll have rows represented by <tr> (table row). Each row contains cells represented by <td> (table data).

<table>
  <tr>
    <td>Row 1, Cell 1</td>
    <td>Row 1, Cell 2</td>
  </tr>
  <tr>
    <td>Row 2, Cell 1</td>
    <td>Row 2, Cell 2</td>
  </tr>
</table>

Table Headers

Sometimes, you want to highlight the headers of your table. Use <th> (table header) instead of <td> for these special cells.

<table>
  <tr>
    <th>Name</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>John Doe</td>
    <td>25</td>
  </tr>
  <tr>
    <td>Jane Smith</td>
    <td>30</td>
  </tr>
</table>

Adding a Caption

Want to give your table a title? Use the <caption> tag just after the <table> tag.

<table>
  <caption>Employee Information</caption>
  <tr>
    <th>Name</th>
    <th>Position</th>
  </tr>
  <tr>
    <td>Alex Johnson</td>
    <td>Developer</td>
  </tr>
  <tr>
    <td>Emily Davis</td>
    <td>Designer</td>
  </tr>
</table>

And there you have it! Tables in HTML provide a structured way to present data, making your webpage organized and visually appealing.

You may be interested in reading more about table in HTML, follow the link below.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table