前面的章节中，Python的基本知识已经差不多介绍完了。本节介绍HTML相关的知识。需要着重声明的是，前端知识是非常非常重要的知识，以我实际项目经验来看，一个项目的瓶颈在设计和前端。设计就先不说了，前端出不来的时候，你就会发现，哪怕你设计再好，无图无真相，领导不鸟你，工资不涨薪，生活没激情，白富美都不想理你……扯多了，大概就是这么个意思。所以前端知识必须得学会，而且是玩溜。
前端三大利器概述
学习前端，不得不学习前端中的三大利器：html + css + javascript。那么这三个组件分别起到什么作用呢？以人体为例，单单具有html属性的人，只是一个裸体的人偶(理解成充气娃娃加工的第一步也行...好邪恶)。这个时候无疑很丑陋，因此需要给这个人偶穿上华丽的外衣，也就是CSS。通过CSS来对这个人的外貌特征、服装色彩进行装饰。装饰之后，OK，基本上可以看了，但是还是缺少了一点人类的基本特征：灵动性。那么js就出马了。js赋予这个人偶能动的机制。比如，当你吻人偶时，它会拥抱你。当你给人偶挠痒痒时，它会呵呵直笑。当你XXXX时，它会亚麻跌...好吧，又邪恶了......其实就是这么个意思：html是裸露的人体结构，css是人华丽的外衣，js是人交互的灵魂。学会这三大利器，你的前端页面，就能实现各种狂拽炫酷吊炸天的特效和交互效果，完成各种需求了。
HTML概述
超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。HTML是一种基础技术，常与CSS、JavaScript一起被众多网站用于设计令人赏心悦目的网页、网页应用程序以及移动应用程序的用户界面。网页浏览器可以读取HTML文件，并将其渲染成可视化网页。HTML描述了一个网站的结构语义随着线索的呈现，使之成为一种标记语言而非编程语言。
HTML元素是构建网站的基石。HTML允许嵌入图像与对象，并且可以用于创建交互式表单，它被用来结构化信息——例如标题、段落和列表等等，也可用来在一定程度上描述文档的外观和语义。HTML的语言形式为尖括号包围的HTML元素（如），浏览器使用HTML标签和脚本来诠释网页内容，但不会将它们显示在页面上。
HTML可以嵌入如JavaScript的脚本语言，它们会影响HTML网页的行为。网页浏览器也可以引用层叠样式表（CSS）来定义文本和其它元素的外观与布局。维护HTML和CSS标准的组织万维网联盟（W3C）鼓励人们使用CSS替代一些用于表现的HTML元素。
HTML基本结构
HTML代码块基本分为三大部分，外加声明部分。其中声明部分不是必须的。
{{ title }}
HTML标签
从上面的html基本三大部分来看，会发现好多<>的标签，这些标签就是HTML中最重要的元素：标签。
标签从写法上，可以分为：自闭合标签和闭合标签。
自闭合标签和闭合标签
自闭合标签和闭合标签的区别就是，自闭合标签不是成对出现的，本身会进行闭合。比如：以"/"进行自我闭合。而闭合标签则比如:
成对出现来闭合。 | 常见的自闭合标签：
块级标签和内联标签
HTML标签从内容上，可以分为：块级标签和内联标签(也叫行内标签)
他们的区别：
块级元素一般用来搭建网站架构、布局、承载内容
内联元素一般用来在网站内容中的某些细节或者部位，用以“强调、区分样式、上标、下标、锚点”等等。
它们可以互相转换。display:inline|block
块级元素的特点：每一个块级元素都识从一个新行开始显示，其后的元素需要另起一行。
内敛标签的特点:位置多少就占用多少,不会另起一行.
Ps:写HTML时要额外注意：不能把块元素放在行内(inline)元素中。
1 块元素(block element) 2 * address - 地址 3 * blockquote - 块引用 4 * center - 举中对齐块 5 * dir - 目录列表 6 * div - 常用块级容易，也是css layout的主要标签 7 * dl - 定义列表 8 * fieldset - form控制组 9 * form - 交互表单 10 * h1 - 大标题 11 * h2 - 副标题 12 * h3 - 3级标题 13 * h4 - 4级标题 14 * h5 - 5级标题 15 * h6 - 6级标题 16 * hr - 水平分隔线 17 * isindex - input prompt 18 * menu - 菜单列表 19 * noframes - frames可选内容，（对于不支持frame的浏览器显示此区块内容 20 * noscript - 可选脚本内容（对于不支持script的浏览器显示此内容） 21 * ol - 排序表单 22 * p - 段落 23 * pre - 格式化文本 24 * table - 表格 25 * ul - 非排序列表 26 27 内联元素(inline element) 28 * a - 锚点 29 * abbr - 缩写 30 * acronym - 首字 31 * b - 粗体(不推荐) 32 * bdo - bidi override 33 * big - 大字体 34 * br - 换行 35 * cite - 引用 36 * code - 计算机代码(在引用源码的时候需要) 37 * dfn - 定义字段 38 * em - 强调 39 * font - 字体设定(不推荐) 40 * i - 斜体 41 * img - 图片 42 * input - 输入框 43 * kbd - 定义键盘文本 44 * label - 表格标签 45 * q - 短引用 46 * s - 中划线(不推荐) 47 * samp - 定义范例计算机代码 48 * select - 项目选择 49 * small - 小字体文本 50 * span - 常用内联容器，定义文本内区块 51 * strike - 中划线 52 * strong - 粗体强调 53 * sub - 下标 54 * sup - 上标 55 * textarea - 多行文本输入框 56 * tt - 电传文本 57 * u - 下划线 58 * var - 定义变量 59 60 可变元素 61 <strong>可变元素为根据上下文语境决定该元素为块元素或者内联元素。strong> 62 * applet - java applet 63 * button - 按钮 64 * del - 删除文本 65 * iframe - inline frame 66 * ins - 插入的文本 67 * map - 图片区块(map) 68 * object - object对象 69 * script - 客户端脚本
这里需要注意一点：当加入了css控制以后，块元素和内联元素的这种属性差异就不成为差异了。比如，我们完全可以把内联元素加上display:block这样的属性，让他也有每次都从新行开始的属性。
HTML语法
想了解更多HTML语法，可以参照：HTML语法英文版、HTML编码规范
HTML的代码注释
代码注释的作用是帮助程序员标注代码的用途，过一段时间后再看你所编写的代码，就能很快想起这段代码的用途。代码注释不仅方便程序员自己回忆起以前代码的用途，还可以帮助其他程序员很快的读懂你的程序的功能，方便多人合作开发网页代码。
/* css中注释 */
// js中注释
HTML的标签组成
一个HTML的标签，通常由标签名，属性，内容三要素组成。
属性要在开始标签中指定，用来表示该标签的性质和特性。通常都是以“属性名=”值””的形式来表示，用空格隔开后，还可以指定多个属性。指定多个属性时不用区分顺序。
更多更全的属性信息，请查看：属性大全
HTML中常用标签之声明
使用 HTML5 的 doctype 来启用标准模式，建议使用大写的 DOCTYPE。
HTML中常用标签之Head 头部标签
在
标签中，常用的标签主要包括： |meta标签
meta标签定义关于 HTML 文档的元信息，主要功能包括：设置页面编码、刷新和跳转、关键词(方便被收录)、描述等功能呢
- meta 标签
- 页面编码
```html
```
- 刷新和跳转
```html
例：2秒刷新一次 :
例：进入网站2秒后跳转页面：
```
- 关键词
- name="keywords" 方便被爬虫收录
```html
例：
```
- 描述
- name="description" 描述信息
```html
例：
title标签
title标签用来定义文档的标题。
学而思教育
link标签
link标签用来定义文档与外部资源的关系。比如：引入css文件、设置网站图标
- 引入css
< link rel="stylesheet" type="text/css" href="css/common.css"/>
- 设置网站图标
style标签