Home > Article > Web Front-end > What does table mean in html5

What does table mean in html5

醉折花枝作酒筹Original: 2021-06-07 11:17:077844browse

In HTML, table is a table, and the syntax format is "
table content
". A simple HTML table includes the table element, one or more tr, th, and td elements; the tr element defines the table row, the th element defines the header, and the td element defines the table cell.

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

A simple HTML table is composed of the table tag and one or more tr, th, td elements.

table tag

The table tag can define a simple table. It is mainly used to control the outer border of the table. It has the margin attribute, which is mainly used to set the outer border of the table. distance. The border attribute is used to set the border of the table and the cellspacing attribute is used to specify the blank space between cells.

tr part:

tr is the main Used to divide several rows in the table. Generally, it only needs to be used to set the height

td part:

td is used to control The attributes of each cell can control the upper, lower, left and right borders of each cell respectively, which also includes padding attributes.

th part: The usage of

th is the same as that of td, except that it is used to distinguish the table header.

Note: Using percentages and using pixels as units in the table are the same.

Example:

<!DOCTYPE html>
<html>
  <head>
    <title>test</title>
  </head>
  <body>
    <table border="1">
      <tr>
        <th>NAME</th>
        <th>AGE</th>
        <th>NUMBER</th>
      </tr>
      <tr>
        <td>xm</td>
        <td>10</td>
        <td>2020</td>
      </tr>
      <tr>
        <td>xh</td>
        <td>3</td>
        <td>2021</td>
      </tr>
      <tr>
        <td>xf</td>
        <td>4</td>
        <td>2010</td>
      </tr>
    </table>
  </body>
</html>

Effect picture:

What does table mean in html5

Cross-row and cross-column processing of tables

We can also set the colspan attribute of the cell to merge it across columns, or set the rowspan attribute of the cell to make it span rows. Merge, as shown below

Example:

<!DOCTYPE html>
<html>
  <head>
    <title>test</title>
  </head>
  <body>
    <table border="1">
      <tr>
        <th>NAME</th>
        <th>AGE</th>
        <th>NUMBER</th>
      </tr>
      <tr>
        <td rowspan="2">xm</td>
        <td>10</td>
        <td>2020</td>
      </tr>
      <tr>
        <td>3</td>
        <td>2021</td>
      </tr>
      <tr>
        <td>xf</td>
        <td>4</td>
        <td>2010</td>
      </tr>
    </table>
  </body>
</html>

Result:

What does table mean in html5

##Recommended learning:

html video tutorial

The above is the detailed content of What does table mean in html5. For more information, please follow other related articles on the PHP Chinese website!

html5 css3 html 外边距 margin padding border table td tr th

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：How to remove html border gapNext article：How to remove html border gap

See more

What does table mean in html5

Related articles