Home > Article > Web Front-end > How to add background to new table in HTML

How to add background to new table in HTML

醉折花枝作酒筹Original: 2021-06-07 11:33:005933browse

In HTML, you can use the background attribute to set the background in a new table. You only need to set the "background: attribute value" for the table element. The background attribute sets all background properties in one statement. You can set the object to a solid background color, or you can set an image to be the background.

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

The color setting of the table is very simple, exactly the same as the text color setting.

CSS sets the background of the table through the background attribute; sets the color of the text in the table through the color attribute.

Example:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      body {
        background-color: #ebf5ff;
        margin: 0px;
        padding: 4px;
        text-align: center;
      }
      table {
        background: pink;
        color: white;
      }
    </style>
  </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>

Effect:

How to add background to new table in HTML

Recommended learning:html video tutorial

The above is the detailed content of How to add background to new table in HTML. For more information, please follow other related articles on the PHP Chinese website!

html5 css css3 html 对象 background

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：What does table mean in html5Next article：What does table mean in html5

See more

How to add background to new table in HTML

Related articles