HTML HTML Tutorial HTML Forms HTML Graphics HTML Media HTML APIs HTML Tags



HTML Tag: col

The HTML <col> tag is used to define a column within a table. It is used in conjunction with the <colgroup> tag to define the properties of one or more columns in a table.

The <col> tag is a self-closing tag, which means it does not require a closing tag. It can be used to define the width, alignment, and other properties of a column in a table.

Brief Explanation of HTML Tag: col

The <col> tag is used to define the properties of a column in a table. It can be used to set the width of a column, the alignment of the content within the column, and other properties such as background color and border.

The <col> tag is often used in conjunction with the <colgroup> tag, which is used to group one or more columns in a table. By using the <colgroup> tag, you can apply the same properties to multiple columns at once.

Here is an example of how to use the <col> tag to define the properties of a column in a table:

  <table>
    <colgroup>
      <col style="background-color: #ccc;">
      <col style="background-color: #ddd;">
    </colgroup>
    <tr>
      <td>Column 1</td>
      <td>Column 2</td>
    </tr>
  </table>

In this example, we have defined a <colgroup> tag with two <col> tags inside. The first <col> tag has a background color of #ccc, while the second <col> tag has a background color of #ddd. These properties will be applied to the first and second columns in the table, respectively.

Code Examples in <p> Tags

Here are some examples of how to use the <col> tag to define the properties of columns in a table:

Example 1:

  <table>
    <colgroup>
      <col style="width: 50%;">
      <col style="width: 50%;">
    </colgroup>
    <tr>
      <td>Column 1</td>
      <td>Column 2</td>
    </tr>
  </table>

In this example, we have defined a <colgroup> tag with two <col> tags inside. The first <col> tag has a width of 50%, while the second <col> tag also has a width of 50%. These properties will be applied to the first and second columns in the table, respectively.

Example 2:

  <table>
    <colgroup>
      <col style="text-align: center;">
      <col style="text-align: right;">
    </colgroup>
    <tr>
      <td>Column 1</td>
      <td>Column 2</td>
    </tr>
  </table>

In this example, we have defined a <colgroup> tag with two <col> tags inside. The first <col> tag has a text-align property of center, while the second <col> tag has a text-align property of right. These properties will be applied to the first and second columns in the table, respectively.

Example 3:

  <table>
    <colgroup>
      <col style="background-color: #ccc;">
      <col style="background-color: #ddd;">
    </colgroup>
    <tr>
      <td>Column 1</td>
      <td>Column 2</td>
    </tr>
  </table>

In this example, we have defined a <colgroup> tag with two <col> tags inside. The first <col> tag has a background color of #ccc, while the second <col> tag has a background color of #ddd. These properties will be applied to the first and second columns in the table, respectively.

References

Activity