## 1.介绍
- HTML 指的是超文本标记语言 (Hyper Text Markup Language)
HTML 不是一种编程语言，而是一种标记语言 (markup language)
标记语言是一套标记标签 (markup tag) HTML 使用标记标签来描述网页
## 2.标签
- HTML 标签是由尖括号包围的关键词，比如\<html>
- HTML 标签通常是成对出现的(单个出现的叫自结束标签)，比如 \<b>和\</b> 标签对中的第一个标签是开始标签，第二个标签是结束标签
- 开始和结束标签也被称为开放标签和闭合标签
meta标签用来设置网页的一些元数据，比如网页的字符集，关键字、简介。
- meta是一个自结束标签，编写一个自结束标签时，可以在开始标签中添加一个/。
\<meta name="description" content="这是我写的一个酷炫的网站。">
\<meta name="author" content="myname" />
- 使用meta标签还可以用来设置网页的关键字。
\<meta name="keywords" content="HTML5,JavaScript,前端,Java" />
- 还可以用来指定网页的描述，搜索引擎在检索页面时，会同时检索页面中的关键词和描述，但是这两个值不会影响页面在搜索引擎中的排名。
\<meta name="description" content="发布h5、js等前端相关的信息" />
- 使用meta可以用来做请求的重定向。
\<meta http-equiv="refresh" content="秒数;url=目标路径" />
\<meta http-equiv="refresh" content="5;url=http://www.baidu.com" /> 5s后重定向到百度
## 3.常用标签
1. HTML 标题（Heading）是通过 \<h1>-\<h6>等标签进行定义的。\<h1>定义最大的标题\<h6>定义最小的标签。
2. HTML 段落是通过\<p>标签进行定义的。
3. HTML 链接是通过\<a>标签进行定义的。
//注释：在 href 属性中指定链接的地址。
4. HTML 图像是通过\<img>标签进行定义的。
//注释：图像的名称和尺寸是以属性的形式提供的
5. 大多数 HTML 元素可以嵌套（可以包含其他 HTML 元素）。
6. 没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。\<br>就是没有关闭标签的空元素（\<br>标签定义换行）。
7. 标签内容最好都是小写。
8. HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。属性总是以名称/值对的形式出现，
比如：name="value"。属性总是在 HTML 元素的开始标签中规定。
属性值应该始终被包括在引号内。双引号是最常用的
9. \<hr>标签在 HTML 页面中创建水平线。\<hr> 元素可用于分隔内容。使用水平线 \<hr>标签来分隔文章中的小节是一个办法（但并不是唯一的办法）。
10. 可以将注释插入 HTML 代码中，这样可以提高其可读性，使代码更易被人理解。浏览器会忽略注释，也不会显示它们。
//注释：开始括号之后（左边的括号）需要紧跟一个叹号，结束括号之前（右边的括号）不需要。
提示：合理地使用注释可以对未来的代码编辑工作产生帮助。
11. 超链接\<a>标签的使用：
~~~html
<!--
1).跳到外部页面
href里面写路径地址。target属性表示打开方式，具体如下
_self:自身窗口打开 _blank:新窗口打开 _top:跳到当前页面顶部
2).打开本地资源，如前面已经写好的页面
href里面写路径，也满足相对，绝对路径原则
3).找到一个锚点
如何使用：
@1,给一个标签设置id属性，那么这个这个标签就可以作为一个锚点
@2,使用<a href="#锚点的id值">..</a>
@ 单独一个"#"表示调到当前页面顶部，与_top相同
4).还可以发邮件，打电话（用于移动端）,QQ
href里面写mailto:邮件地址
tel:电话号码
5).找到超链接，用text-decortion可去掉下划线
-->
~~~
12. name 属性规定锚（anchor）的名称。您可以使用 name 属性创建 HTML 页面中的书签。书签不会以任何特殊方式显示，它对读者是不可见的。
当使用命名锚（named anchors）时，我们可以创建直接跳至该命名锚（比如页面中某个小节）的链接，这样使用者就无需不停地滚动页面来寻找他们需要的信息了。
>[info] 锚的名称可以是任何你喜欢的名字。
>您可以使用 id 属性来替代 name 属性，命名锚同样有效。
13. 图像标签\<img>：
使用img标签来向网页中引入一个外部图片。img标签也是一个自结束标签。
- 属性：
- src：设置一个外部图片的路径。
- alt：可以用来设置在图片不能显示时，对图片的描述。搜索引擎可以通过alt属性来识别不同的图片。如果不写alt属性，则搜索引擎不会对img中的图片进行收录。
- title:当鼠标移动到图片上显示的内容。
- width：可以用来修改图片的宽度,一般使用px作为单位。
- height：可以用来修改图片的高度，一般使用px作为单位。
宽度和高度两个属性如果指设置一个，另一个也会同时等比例调整大小如果两个值同时指定则按照你指定的值来设置，一般开发中除了自适应的页面(根据设备不同，显示效果不一样)，不建议设置width和height。
> src属性配置的是图片的路径，目前我们所要使用的路径全都是相对路径。
>[info]相对路径：相对路径指相对于当前资源所在目录的位置，可以使用../来返回一级目录,返回几级目录就写几个../
\<img src="abc/bcd/2.gif" alt="这是一个大松鼠"/>
\<img src="../../img/2.gif" alt="这是一个大松鼠"/>
14. 特殊字符：
在HTML中，一些如< >这种特殊字符是不能直接使用，需要使用一些特殊的符号来表示这些特殊字符，这些特殊符号我们称为实体（转义字符串）。浏览器解析到实体时，会自动将实体转换为其对应的字符
实体的语法：&实体的名字;
< \< > \> 空格 \ 版权符号 \© \÷ ÷
15. 表格由\<table> 标签定义。每行被分割为若干单元格（由 \<tr> 标签定义）。字母 \<td> 指表格数据（table data），即数据单元格的内容。
> 数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。表格的表头使用\<th>标签进行定义。
16. 无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。无序列表始于\<ul>标签。每个列表项始于\<li>标签。
17. 有序列表也是一列项目，列表项目使用数字进行标记。有序列表始于\<ol>标签。每个列表项始于\<li>标签。
18. 自定义列表不仅仅是一列项目，而是项目及其注释的组合。自定义列表以\<dl>标签开始。每个自定义列表项以\<dt>开始。每个自定义列表项的定义以\<dd>开始。
19. 块状元素：\<h1>-\<h6> \<p> \<ul> \<table> \<li> 行类元素：\<b> \<td> \<a> \<img>
20. 背景颜色属性将背景设置为某种颜色。属性值可以是十六进制数、RGB(255,255,255)值(0-255)或颜色名。
## 4.图片的格式
- JPEG(JPG)- JPEG图片支持的颜色比较多，图片可以压缩，但是不支持透明，一般使用JPEG来保存照片等颜色丰富的图片。
- GIF- GIF支持的颜色少，只支持简单的透明，支持动态图，图片颜色单一或者是动态图时可以使用gif。
- PNG- PNG支持的颜色多，并且支持复杂的透明，可以用来显示颜色复杂的透明的图片。
>[info] 图片的使用原则：效果不一致，使用效果好的。效果一致，使用小的。
> 编写一段内容，在纯文本编辑器中编写的内容都是纯文本，网页就是使用纯文本编写的。纯文本中只能保持文本内容。图片，音频，视频等格式化的内容，都不能设置。
>[info]元素的自定义属性：在HTML中能自定义属性的只有如下：id（不允许重复）、 class、 name（可重复）
