HTML Tables

Table is used to structure or represent data in the website. Details of table are given below:

Tables:

Table has two types <tr> and <td>. Both types also have closing tag <tr></tr> and <td></td>.

<tr> stands for table row and <td> stands for table data . In <tr> we write heading in rows and in <td> we write table data.

For Example:

<table>
  <tr>
    <td>Raja</td>
    <td>Junaid</td>
  </tr>
  <tr>
    <td>Milk</td>
    <td>Chocolate</td>
  </tr>
</table>

Output:

Raja Junaid

Milk Chocolate


Table have <thead>, <tbody> and <tfoot>. All of them also have closing tag. <tfoot> is not widely used in HTML

For Example:

<table>
    <thead>
        <tr>
            <th colspan="2">The table header</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>The table body</td>
            <td>with two columns</td>
        </tr>
    </tbody>
</table>

Another Example:

<table style="width:100%">
  <tr>
    <th>Company</th>
    <th>Contact</th>
    <th>Country</th>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>Mexico</td>
  </tr>
</table>

Output of table link is given below and do it by yourself: https://www.w3schools.com/tags/tag_table.asp

If you want to check more examples, then the link is given below: https://www.w3schools.com/html/html_tables.asp


Tables also have layouts to represent data, the link is given below:

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

Comments

Popular Posts