Table Tag (table) In-depth

Table Tag (table) In-depth
<br />Table is a tag that has been used by everyone for a long time, and it is still in use today. However, due to the current website reconstruction, it is recommended that you do not use tables for layout. Many friends mistakenly believe that using tables is so-called non-standard. In fact, it is not. Table is an important element.
Not long ago, I was looking for the main tags contained in the table. Of course, I wanted to share it with you.
The table tags mainly include table, caption, th, tr, td, thead, tfoot, tbody, col, colgroup . The introduction of each is as follows:
<table>
The table tag defines a table. Inside the <table> tag, you can place table headers, table rows, table columns, table cells, and other table content.
<caption>
The caption element defines a table title. The caption tag must come right after the table tag. You can define only one header per table. Typically this title will be centered above the table.
<th>
Defines the header cells within a table. Text inside this th element is usually rendered in bold.
<tr>
Defines a row in a table.
<td>
Defines a cell in a table.
<thead>
Defines the table header.
The thead, tfoot, and tbody elements give you the ability to group rows in a table. When you create a table, you probably want to have a header row, some rows with data, and a total row at the bottom. This division enables browsers to support scrolling of the table body independently of the table header and footer. When long forms are printed, the table header and footer may be printed on each page that contains the table data.
<tbody>
Defines a table body (text).
Using the <tbody> tag, you can divide a table into a separate section. The <tbody> tag can group one or more rows in a table.
Although you may be tempted to include one, or even two, or more <tbody> tags within a table, we recommend that you have no <tbody> tags within a table.
Within the <tbody> tag, only the <tr> tag can define table rows. And once defined, a <tbody> tag is an independent part of the table. For example, you cannot span from one <tbody> to another <tbody>.
The thead, tfoot, and tbody elements give you the ability to group rows in a table. When you create a table, you probably want to have a header row, some rows with data, and a total row at the bottom. This division enables browsers to support scrolling of the table body independently of the table header and footer. When long forms are printed, the table header and footer may be printed on each page that contains the table data.
<tfoot>
Defines the table's footer (footnote).
The thead, tfoot, and tbody elements give you the ability to group rows in a table. When you create a table, you probably want to have a header row, some rows with data, and a total row at the bottom. This division enables browsers to support scrolling of the table body independently of the table header and footer. When long forms are printed, the table header and footer may be printed on each page that contains the table data.
<col>
Defines the value of a property for one or more columns in a table. You can use this attribute only in a table or colgroup.
<colgroup>
Defines grouping of table columns. This element allows you to group columns for formatting purposes. This element is only valid inside a <table> tag.
There are two ways to use the <colgroup> tag: one is to simply define several identical columns, and the other is to group several different columns together.
PS: The above content is all from w3school, because w3school has marked the copyright in the copyright information and reserves all rights. Then I won’t repost or edit it. I’ll just take a paragraph and you can click to directly view the detailed introduction of a tag. See also the introduction to tables.

<<:  How to remotely connect to MySQL database with Navicat Premium

>>:  Deleting two images with the same id in docker

Recommend

Weird and interesting Docker commands you may not know

Intro Introduces and collects some simple and pra...

Implementation of Docker cross-host network (overlay)

1. Docker cross-host communication Docker cross-h...

Detailed explanation of docker network bidirectional connection

View Docker Network docker network ls [root@maste...

Why MySQL chooses Repeatable Read as the default isolation level

Table of contents Oracle Isolation Levels MySQL I...

Example of how to set automatic creation time and modification time in mysql

This article describes how to set the automatic c...

Docker volume deletion operation

prune To use this command, both the client and da...

JavaScript implements changing the color of a web page through a slider

Hello everyone, today when I was looking at the H...

Font Treasure House 50 exquisite free English font resources Part 2

Designers have their own font library, which allo...

mysql5.7.18 decompressed version to start mysql service

The decompressed version of mysql5.7.18 starts th...

How to use webpack and rollup to package component libraries

Preface I made a loading style component before. ...

Solution to the problem of data loss when using Replace operation in MySQL

Preface The company's developers used the rep...

How to obtain root permissions in a docker container

First, your container must be running You can vie...

JavaScript to achieve full or reverse selection effect in form

This article shares the specific code of JavaScri...

Detailed example of how to implement transaction commit and rollback in mysql

Recently, we need to perform a scheduled migratio...

Example of adding music video to HTML page

1. Video tag Supports automatic playback in Firef...