以下代码显示了一个应用于某些文本的 HTML 元素的简单示例。
I like <code>web</code> and CSS.
起始标记为<code>,结束标记为</ code>。标签之间是元素的内容,即 web。标签和内容一起形成代码元素。
HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。
开始标签 | 元素内容 | 结束标签 |
---|---|---|
<p> | This is a paragraph | </p> |
<a href=”default.htm” > | This is a link | </a> |
<br /> |
注释:开始标签常被称为开放标签(opening tag),结束标签常称为闭合标签(closing tag)。
注意 1
我们使用元素来执行以下操作:
- HTML 元素以开始标签起始
- HTML 元素以结束标签终止
- 元素的内容是开始标签与结束标签之间的内容
- 某些 HTML 元素具有空内容(empty content)
- 空元素在开始标签中进行关闭(以开始标签的结束而结束)
- 大多数 HTML 元素可拥有属性
注意 2
元素名称不区分大小写。
浏览器会识别 <CODE> 和 <code>,甚至 <CoDe> 作为代码元素的起始标签。
一般来说,惯例是采用单一案例格式并坚持。更常见的样式是使用小写字符。
注意 3
HTML 定义了在 HTML 文档中实现各种角色的不同类型的元素。
代码元素是语义元素的示例。语义元素允许我们定义我们的内容的意义以及内容的不同部分之间的关系。
空元素
您不需要在开始和结束标签之间放置任何内容。
如果你没有,你创建一个空元素,如下面代码所示。
I like <code></code> HTML and CSS.
并非所有元素都是空的,但即使如此,这仍然是有效的 HTML。
自闭合标签
您可以使用单个标记更简洁地表达空元素,如下面的代码所示。
I like <code/> HTML and CSS.
您将开始和结束标记组合成一个笔划字符(/)它用于表示结束标记的开始。
上面的代码与以下代码具有相同的含义。
I like <code></code> HTML and CSS.
单个标签是表达空元素的更简洁的方式。
空元素
有一些元素必须使用单个标签表示。这些被称为空元素。
一个这样的元素是 hr
。
hr
是一个分组元素,用于表示一个段落级别的内容。
您可以使用以下两种方式之一使用 void 元素 – 第一种方法是仅指定开始标记,如以下代码所示。
I like HTML. <hr> I like CSS.
浏览器知道 hr 是一个 void 元素,因此不希望看到结束标记。
您可以使元素与空元素一致,如下面的代码所示。
I like HTML. <hr/> I like CSS.
嵌套的 HTML 元素
大多数 HTML 元素可以嵌套(可以包含其他 HTML 元素)。
HTML 文档由嵌套的 HTML 元素构成。
HTML 文档实例
<html> <body> <p>This is my first paragraph.</p> </body> </html>
HTML注释
注释是关于 HTML 元素的有用信息。注释使 HTML 文档更易读和可理解。
HTML 中的注释以标签<!--
开头,并以 -->
结尾。
浏览器将忽略您在这些标记中放置的任何内容。
以下代码具有 HTML 注释。
<!DOCTYPE HTML> <html> <head> <!-- metadata goes here --> <title>Example</title> </head> <body> This is the <code>content</code>. </body> </html>