# 基本概念和结构
HTML5 是继 HTML4.01 和 XHTML1.0 之后的『超文本标记语言』的最新版本。
HTML5 包括:HTML5 核心规范(标签元素)、CSS(层叠样式)和 JavaScript 。
所有的 HTML 文档都是一个『有结构的文本文档』,HTML 元素的作用就是描述文件内容的结构关系。
HTML 文件本质上是一个文本文件。浏览器的作用是将这个文本文件『翻译』成一个画面。
浏览器的作用是将这个文本文件『翻译』成一个画面
。这一观点极其重要。
基本的 HTML 文档结构如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
</html>
TIP
HTML 文件的内容及格式本质上就是一个非严格的 XML 文件。
带有 <>
符号的元素被称为 HTML 标记,标记放在标记符(<>
)中,用于表示某个功能的编码命令,也称为 HTML 标签,或 HTML 元素。
# 1.1. <!DOCTYPE> 元素
<!DOCTYPE>
位于文档的第一行,用于向浏览器说明当前文档使用的是哪种 HTML 规范。
<!DOCTYPE html>
表示的是本文档 使用/遵循 HTML5 规范。
# 1.2. <html> 元素
<html>
元素是紧接 <DOCTYPE>
之后的元素,它也被称为 根元素,因为它是整个 HTML 文件层次结构的顶点。
该元素以 <html>
标签开始,以 </html>
标签结束,其中『包含』文档的头部和体部。
# 1.3. <head> 元素
<head>
元素用于定义 HTML 文档的头部信息,紧跟在 <html>
元素之后,主要用于封装其它位于文档头部的标记,例如:<title>
、<meta>
、<link>
、<style>
等。
<title>
元素用于描述文档的标题。<meta>
元素提供有关页面的元信息,也可以指定字符编码。<link>
元素用于定义与外部资源的关系,最常见用于链接样式表(CSS)。<style>
元素用于为 HTML 定义样式信息。
一个 <head>
中只能有一个 <head>
元素,并且 <head>
元素中的内容不会显示在浏览器的浏览区。
# 1.4. <body> 元素
<body>
元素用于定义 HTML 文档所要显示的内容。<body>
元素中的信息才是最终展示给用户的信息。
一个 HTML 文档中只能有一个 <body>
元素。
<body>
元素是 <html>
元素的子元素,位于 <head>
元素之后,与 <head>
元素是『兄弟』关系。