In this section, we're going to learn to use tables in HTML.

Before that, I want you to remember one thing. You should use tables only when you're working with tabular data. In all other cases, you should use CSS styles. Never design your site to fit into an HTML table, as that would be a complete disaster.

That said, let's get on with our tables. As you would've guessed, there is a tag called <table> that would create a table for us. In this example, I want to build a table of baseball players. To do that, we have to use another tag called <tr>, that stands for table row. As the name suggests, each tag represents a single row in the table, so we can have a row for Player 1, Player 2 and so on. Each of these rows are separated by columns. If you've worked with Microsoft Excel, this should be familiar to you.

Next, we're going to use a tag called <th> inside every <tr> tag, and this represents the heading for every column. Let's have four headings, one each for name, average, home runs and RBIs.

<table>

  <tr>
    <th>Name</th>
    <th>Average</th>
    <th>HRs</th>
    <th>RBIs</th>
  </tr>

</table>

This is the end of the row, and this is why we have a closing </tr> tag.

The next one is going to be a new row, and we'll fill it with information. Since this is not a heading, we'll use a tag called <td>. Every element in our table should be inside a <td> tag. When you fill information, keep the image of a grid in mind. For example, the information should be the name of the player, his average, his home runs and RBIs. This mapping is important while creating tables. So, the code is:

<tr>
  <td>Altuve, Jose</td>
  <td>350</td>
  <td>32</td>
  <td>120</td>
</tr>

And the output is,

You can create more rows like this, and fill them with the right information.

Since I want this to be an admin dashboard, I'll also have edit and delete items.

So, this is how you create tables in HTML.