HTML Tutorial

HTML Tag: <table>

Understanding the <table> Tag

The <table> tag defines a table structure in HTML. It organizes data into rows and columns, allowing for a tabular representation of information.

Attributes of <table>

  • border: Sets the border width of the table
  • cellpadding: Adds space between the cell content and its borders
  • cellspacing: Adds space between table cells
  • summary: Provides a short description of the table's purpose

Examples with <table>

  • To create a simple table with two rows and two columns:
<table>
 <tr>
  <th>Name</th>
  <th>Age</th>
 </tr>
 <tr>
  <td>John Doe</td>
  <td>30</td>
 </tr>
</table>
  • To set a border and cellpadding:
<table border="1" cellpadding="5">
 ... 
</table>

Exploring the <table> Tag - HTML Example

<!DOCTYPE html>
<html>
<head>
  <title>Table Example</title>
</head>
<body>
  <h1>Employee Information</h1>
  <table>
    <tr>
      <th>Name</th>
      <th>Age</th>
      <th>Salary</th>
    </tr>
    <tr>
      <td>John Doe</td>
      <td>30</td>
      <td>$50,000</td>
    </tr>
    <tr>
      <td>Jane Smith</td>
      <td>25</td>
      <td>$45,000</td>
    </tr>
  </table>
</body>
</html>

This example demonstrates a table with 3 rows and 3 columns, including a header row with column labels.

Additional Information

  • Use the <tr> tag to create a table row.
  • Use the <th> tag for table header cells and the tag for normal data cells.
  • Consider using CSS (Cascading Style Sheets) to style and customize tables for improved visual appeal.