HTML Table

Sometimes you’ve got stuff to show—like a schedule, a price list, or even a leaderboard—that just begs for order. Enter the HTML table. It’s like a mini spreadsheet right in your webpage, and once you get the hang of it, it’s a breeze to set up. Let’s build one together!


The main players are a few tags: <table> to start it, <tr> for rows, <td> for cells, and <th> for headers. Here’s a basic one:

<table>
<tr>
<th>Name</th>
<th>Score</th>
</tr>
<tr>
<td>Ajay</td>
<td>85</td>
</tr>
<tr>
<td>Yogesh</td>
<td>92</td>
</tr>
</table>

Open that, and you’ll see a tidy grid: “Name” and “Score” as bold headers, with “Alex 85” and “Sam 92” lined up below. The <table> wraps it all, <tr> kicks off each row, <th> marks the top labels, and <td> holds the data.

I’ve fiddled with these a lot. Once, I forgot a </tr> and the whole thing went wonky—lesson learned: close every tag! You can make it fancier too. Add a border with an old-school attribute:

<table border="1">
<tr>
<td>Cat</td>
<td>Dog</td>
</tr>
</table>

That border="1" gives it a thin outline—crude but effective. (Pro tip: borders are styled better with CSS later, but this works for now.)


Here’s a real one I’ve tried:

<table>
<tr>
<th>Day</th>
<th>Task</th>
</tr>
<tr>
<td>Monday</td>
<td>Code</td>
</tr>
<tr>
<td>Tuesday</td>
<td>Chill</td>
</tr>
</table>

It’s a little to-do list, nice and neat. Tables can get wild—spanning rows or columns—but start simple like this. Next time you’ve got data to show off, whip up a <table> and watch it snap into place. It’s like giving chaos a cozy grid to live in!

How-To Guides for HTML

No How-To Guide is available right now.

Keep Learning & Level Up!

Enhance your HTML skills with our in-depth tutorials and interactive quizzes.

Explore HTML Quiz