HTML Table

HTML Table:

The HTML Table tag (<table>) is used to create tables on web pages. Tables are used to display tabular data in rows and columns. Each row in a table is defined using the <tr> tag, and each cell in a row is defined using the <td> tag. The <th> tag is used to define header cells for a table.

Here is an example of a basic HTML table:

<table>

     <tr> 

<th>Firstname</th> 

<th>Lastname</th> 

<th>Age</th> 

    </tr> 

    <tr> 

        <td>John</td> 

        <td>Doe</td>

         <td>35</td> 

    </tr> 

    <tr> 

        <td>Jane</td> 

        <td>Doe</td> 

        <td>28</td>

     </tr> 

</table> 

In this example, we have created a table with three columns (Firstname, Lastname, and Age) and two rows of data (John Doe and Jane Doe).

The <table> tag has several properties that can be used to customize the appearance and behavior of the table. Here are some of the most commonly used properties:

• border: Specifies the width of the border around the table. By default, the border is set to 0 (no border).
• cellpadding: Specifies the amount of space between the cell content and the cell border. By default, the value is set to 1.
• cellspacing: Specifies the amount of space between the cells in a table. By default, the value is set to 0.
• width: Specifies the width of the table. By default, the table width is determined by the content of the cells.
• height: Specifies the height of the table. By default, the table height is determined by the content of the cells.
• align: Specifies the horizontal alignment of the table. The value can be left, center, or right.
• bgcolor: Specifies the background color of the table.

Here is an example of a table with some of these properties set:

<table border="1" cellpadding="5" cellspacing="0" width="500" height="200" align="center" bgcolor="#FFFFCC">

     <tr> 

        <th>Firstname</th> 

        <th>Lastname</th>

        <th>Age</th>

     </tr>

     <tr> 

        <td>John</td> 

        <td>Doe</td> 

        <td>35</td>

     </tr> 

     <tr> 

        <td>Jane</td> 

        <td>Doe</td> 

        <td>28</td> 

      </tr>

 </table> 

In this example, we have set the border to 1, the cellpadding to 5, the cellspacing to 0, the width to 500, the height to 200, the alignment to center, and the background color to #FFFFCC.

There are many other properties that can be used to customize tables in HTML, such as colspan and rowspan, which allow cells to span multiple rows or columns, and thead, tbody, and tfoot, which allow you to group rows into sections of the table.

Uses of HTML 5 Tables:

HTML5 tables are commonly used to present data in a tabular format. Here are some of the common uses of tables in HTML5:

1. Displaying data: Tables are commonly used to display data in a structured format. They can be used to display a range of data types such as numbers, text, images, and links.
   
2. Comparison of data: Tables are useful for comparing data values side-by-side. For example, a table can be used to compare product prices or features.
   
3. Organizing information: Tables can be used to organize information in a logical and structured manner. For example, a table can be used to display contact information or a schedule of events.
   
4. Creating forms: Tables can be used to create forms for user input. For example, a table can be used to create a registration form or a survey.
   
5. Creating layouts: Tables can be used to create layouts for web pages. For example, a table can be used to create a two-column layout where one column contains a navigation menu and the other contains the main content.
   

Overall, tables are a versatile and useful tool for presenting data and organizing information on web pages.