HTML元素

2021-09-26 09:15:46 浏览数 (1)

HTML 元素由开始标记、一些内容和结束标记定义。

HTML 元素

HTML元素是从开始标记到结束标记的所有内容:

<tagname>内容在这里....</tagname>

一些 HTML 元素的示例:

<h1>My First Heading</h1>

<p>My first paragraph.</p>

Start tag

Element content

End tag

<h1>

My First Heading

</h1>

<p>

My first paragraph.

</p>

<br>

none

none

注意:一些 HTML 元素没有内容(如 <br> 元素)。这些元素称为空元素。空元素没有结束标签!


嵌套的 HTML 元素

HTML 元素可以嵌套(这意味着元素可以包含其他元素)。

所有 HTML 文档都由嵌套的 HTML 元素组成。

下面的例子包含四个HTML元素(<html><body><h1><p>):

例子

代码语言:html复制
<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

示例说明

<html>元素是根元素,并将其定义了整个HTML文档。

它有一个开始标签<html>和一个结束标签</html>

然后,在<html>元素内部有一个<body> 元素:

代码语言:javascript复制
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>

<body>元素定义了文档的正文。

它有一个开始标签<body>和一个结束标签</body>

然后,在<body>元素内部还有另外两个元素: <h1><p>

代码语言:javascript复制
<h1>My First Heading</h1>
<p>My first paragraph.</p>

<h1>元素定义了一个标题。

它有一个开始标签<h1>和一个结束标签</h1>

代码语言:javascript复制
<h1>My First Heading</h1>

<p>元素定义了一个段落。

它有一个开始标签<p>和一个结束标签</p>

代码语言:javascript复制
<p>My first paragraph.</p>

永远不要跳过结束标签

即使您忘记了结束标记,某些 HTML 元素也会正确显示:

例子:

代码语言:javascript复制
<html>
<body>

<p>This is a paragraph
<p>This is a paragraph

</body>
</html>

但是,永远不要依赖于此!如果忘记结束标记,可能会出现意外结果和错误!


空的 HTML 元素

没有内容的 HTML 元素称为空元素。

<br>标签定义换行,并且是一个没有结束标记的空元素:

例子

代码语言:javascript复制
<p>This is a <br> paragraph with a line break.</p>

HTML 不区分大小写

HTML 标签不区分大小写:<P><p>.

HTML 标准不要求小写标记,但 W3C 建议在 HTML 中使用小写字母,并要求在 XHTML 等更严格的文档类型中使用小写字母。

在 W3Schools,我们总是使用小写的标签名称。

HTML 标签参考

W3Schools 的标签参考包含有关这些标签及其属性的附加信息。

Tag

Description

<html>

Defines the root of an HTML document

<body>

Defines the document's body

<h1> to <h6>

Defines HTML headings

0 人点赞