1 Star 0 Fork 1

小弟调调 / html-tutorial

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
body.md 2.88 KB
AI 代码解读
一键复制 编辑 原始数据 按行查看 历史
小弟调调 提交于 2022-04-30 01:50 . doc: add tag document.

HTML <body> 标签

示例

一个简单的 HTML 文档:

<html>
<head>
  <title>Title of the document</title>
</head>
<body>
  <h1>This is a heading</h1>
  <p>This is a paragraph.</p>
</body>
</html>

定义和用法

<body> 标签定义了文档的正文。

<body> 元素包含 HTML 文档的所有内容,例如标题、段落、图像、超链接、表格、列表等。

注意: HTML 文档中只能有一个 <body> 元素。

浏览器支持

Element chrome edge firefox safari opera
<body> Yes Yes Yes Yes Yes

全局属性

<body> 标签支持 HTML 中的全局属性

事件属性

<body> 标签支持 HTML 中的事件属性

更多示例

将背景图像添加到文档(使用 CSS):

<html>
<head>
  <style>
    body {
      background-image: url(good.png);
    }
  </style>
</head>
<body>
  <h1>Hello world!</h1>
  <p><a href="https://jaywcjlove.github.io/html-tutorial">HTML Tutorial!</a></p>
</body>

设置文档的背景颜色(使用 CSS):

<html>
<head>
<style>
  body {
    background-color: #E6E6FA;
  }
</style>
</head>
<body>
  <h1>Hello world!</h1>
  <p><a href="https://jaywcjlove.github.io/html-tutorial">HTML Tutorial!</a></p>
</body>

设置文档中文本的颜色(使用 CSS):

<html>
<head>
  <style>
    body {
      color: green;
    }
  </style>
</head>
<body>
  <h1>Hello world!</h1>
  <p>This is some text.</p>
  <p><a href="https://jaywcjlove.github.io/html-tutorial">HTML Tutorial!</a></p>
</body>
</html>

设置文档中未访问链接的颜色(使用 CSS):

<html>
<head>
  <style>
    a:link { color:#0000FF; }
  </style>
</head>
<body>
  <p><a href="https://jaywcjlove.github.io/html-tutorial/html/">HTML Tutorial</a></p>
</body>
</html>

设置文档中活动链接的颜色(使用 CSS):

<html>
<head>
  <style>
    a:active { color:#00FF00; }
  </style>
</head>
<body>
  <p><a href="https://jaywcjlove.github.io/html-tutorial/html/">HTML Tutorial</a></p>
</body>
</html>

设置文档中访问链接的颜色(使用 CSS):

<html>
<head>
  <style>
    a:visited { color:#FF0000; }
  </style>
</head>
<body>
  <p><a href="https://jaywcjlove.github.io/html-tutorial/html/">HTML Tutorial</a></p>
</body>
</html>

默认 CSS 设置

大多数浏览器将显示具有以下默认值的 <body> 元素:

body {
  display: block;
  margin: 8px;
}
body:focus {
  outline: none;
}
1
https://gitee.com/jaywcjlove/html-tutorial.git
git@gitee.com:jaywcjlove/html-tutorial.git
jaywcjlove
html-tutorial
html-tutorial
main

搜索帮助