HTML 是什么？
HTML，全称 “Hyper Text Markup Language（超文本标记语言）” ，它是创建网页最基本的语言。
HTML 使用各种元素（比如标题、段落、图片等）来描述一个网页的结构。HTML 为一个网页提供基本结构，然后我们可以进一步使用 CSS 来美化网页，或者使用 JavaScript 来为网页增加交互特效。
所有的 Web 开发都离不开 HTML 的学习。不管你是准备做前端开发，还是做后端开发（如 Java 后端开发），都必须要对 HTML 有基本的了解。
HTML 语法
HTML 是网页的标准语言，它并不是一门编程语言（如 C/C++、Java 等），而是一门描述性的标记语言。
语法：
<标签符>内容</标签符>
说明：
标签符一般都是成对出现的，包含一个 “开始符号” 和一个 “结束符号”。结束符号只是在开始符号前面多加上了一个斜杠 “/”。当浏览器收到 HTML 文本后，就会解析里面的标签符，然后把标签符对应的功能表达出来。
举个例子，我们一般用 “<em>绿叶网</em>” 来定义文本为斜体。当浏览器遇到该标签对时，就会把标签中的文字用斜体显示出来。比如当浏览器遇到下面这行代码时，就会得到一个斜体文字效果（如下图所示）。
<em>绿叶网 - 为好教程，全力以赴</em>
学习 HTML 究竟要学些什么呢？用最简单的一句话来说就是，学习各种标签来搭建网页的 “骨架”。在 HTML 中，标签有很多种，比如文本标签、图片标签、表单标签等。
HTML 是一门描述性的语言，就是用标签来说话。举个例子，如果你要在浏览器显示一段文字，就应该使用 “段落标签（p）”；如果要在浏览器显示一张图片，就应该使用 “图片标签（img）”。针对你想显示东西的不同，使用的标签也会不同。
总而言之，学习 HTML 就是学习各种各样的标签，然后针对你想显示什么东西，再对应地使用正确的标签，非常简单。
注意: 很多时候，我们也把 “标签” 说成 “元素”，例如把 “div 标签” 说成 “div 元素”。标签和元素，其实说的是一个意思，仅仅是叫法不同罢了。
HTML 结构
对于一个网页来说，它最基本的 HTML 结构由以下 4 部分组成。
- 文档声明：
<!DOCTYPE html>。 - html 标签对：
<html></html>。 - head 标签对：
<head></head>。 - body 标签对：
<body></body>。
一个完整的 HTML 页面，其实就是由一对对的标签组成的（当然也有例外）。接下来，我们简单介绍一下这 4 个部分的作用。
1. 文档声明
<!DOCTYPE html> 是一个文档声明，表示这是一个 HTML 页面。
2. html 标签
<html></html> 标签的作用是，告诉浏览器这个页面是从 <html> 开始，然后到 </html> 结束的。在有些老项目中，我们可能会经常看到这样一行代码：
<html xmlns="http://www.w3.org/1999/xhtml">
上面代码其实是在告诉浏览器，当前页面使用的是 W3C 的 XHTML 标准。这里小伙伴了解即可，不用深究。因为在一般情况下，我们是不需要加上 xmlns="http://www.w3.org/1999/xhtml" 的。
3. head 标签
<head></head> 是网页的 “头部”，用于定义一些特殊的内容，比如页面标题、定时刷新、外部文件等。
4. body 标签
<body></body> 是网页的 “身体”。对于一个网页来说，大部分代码都是在这个标签对内部编写的。
对于 HTML 结构，小伙伴们还要清楚以下 2 点。
- 对于 HTML 结构，虽然大多数开发工具都会自动生成，但作为初学者，大家一定要能够默写出来，这是需要记忆的（其实也很简单）。
- 记忆标签时有一个小技巧：根据英文意思来记忆。比如 head 表示 “页头”，body 表示 “页身” 等。
HTML 示例
下面我们来看一个简单的例子，让小伙伴们感性认识 HTML 是怎样的一个东西。
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>这是网页的标题</title>
</head>
<body>
<p>这是网页的内容</p>
</body>
</html>浏览器效果如下图所示。
分析：
title 是 head 标签的内部标签，其中 <title></title> 标签内定义的内容是页面的标题。这个标题不是文章的标题，而是在浏览器地址栏的那个标题。
<p></p> 是段落标签，用于定义一段文字。对于这些标题的具体用法，我们在后面章节会详细介绍，这里只需要简单了解就可以了。
HTML 元素和属性
在 HTML 中，元素（即标签）是一个网页最基本的构建块。每个元素本身又可以有它们的属性，这些属性提供了元素的附加信息。
例如 a 元素用于表示一个超链接，它本身又有很多属性：比如可以使用 href 属性来定义超链接跳转的地址，也可以使用 target 属性来定义是否使用新窗口打开。
<a href="https://www.lvyenet.com" target="_target">绿叶网</href>
所有 HTML 元素都有的属性叫做 “HTML 全局属性”，常见的有 id、class 等。而某些属性是某个元素特有的，比如 src 属性是 img 元素特有的，而 href 属性是 a 元素特有的。
HTML 学习资源
除了 HTML 教程之外，我们还为小伙伴提供超详细的 HTML 参考手册，包括：
如果想要学习前端开发，除了 HTML 之外，我们至少还需要学习 CSS 和 JavaScript 才行。
HTML 常见问题
1. 现在都有 HTML5 了，为什么还要学 HTML 呢？
HTML 是从 HTML4.01 升级到 HTML5 的。我们常说的 HTML 指的是 “HTML4.01” ，而 HTML5 一般指的是 “相对于 HTML4.01 新增加的内容” 。并不是说 HTML4.01 被淘汰了，准确来说，你要学的 HTML 应该是 HTML4.01 加上 HTML5。
之前很多小伙伴以为只要学 HTML5 就行了，没必要再去学 HTML。殊不知如果你没有 HTML 基础，是学不来 HTML5 的。并且学习 HTML5 也还得有 JavaScript 基础才行。
2. HTML 的学习门槛高吗？
学习 HTML 不需要任何编程基础，即使是小学生也可以学。当年我读大学的时候，计算机网络这门课的教授就说，他见过有些小学生都会做网页了！不要抱怨自己学不会，那是你没有足够用心。
3. 学完 HTML 教程需要花多少时间？学完我能达到什么水平呢？
即使没有任何编程基础，认真学习的话，一周就可以入门 HTML 了。当然，仅仅学完这个教程，也只是能够制作简单的网页的入门程度而已。如果想要达到实际工作的水平，我们还得学习更多的内容才行，包括 HTML5、CSS3、ES6、Vue 等。
4. 如果我想达到真正的前端工程师水平，还要继续学习哪些内容呢？
前端开发相关的技术实在是太多了，很多小伙伴完全不知道怎么入手。就算上网问别人，回答也是五花八门。下面是我们推荐的前端学习路线。
HTML → CSS → JavaScript → HTML5 → CSS3 → ES6 → Vue.js（或 React） → Node.js
这是一条比较理想的前端开发学习路线。除了掌握这些技术，后期还需要学习更多辅助性的技能，包括 SCSS、TypeScript、UI 框架等。学完并且能够在实际项目熟练应用之后，才算得上一位真正意义上的前端工程师。
