html标签
如果把网页比作洋葱，一层包一层，那<html>标签就是洋葱最外层的皮， <html> 元素是一张网页的根元素，所以其他所有元素都是是此元素的后代。
body标签
把一张网页比作一个人<body>标签就表示一个人所有的可见部分，如五官、四肢、痔疮... 对于真实存在的但是肉眼不可见的部分，如思想、人格、性取向等<body>标签是管不着的。 <body>包含着页面中所有的可见元素，比如链接、段落、图片... <body>是所有的可见元素的先人。
head标签
把一张网页比作一个人<head>标签就包含了一个人的基础信息，虽然无法直接观察到，但确实存在， 如姓名、人格、取向等等; <head>用于包含一张网页中抽象的基础信息（元信息）；<head>和<body>的区别在于<body>只想包含看得见摸得着的内容，如身材、长相、肤色等等；<head>中只能包含抽象的元信息，并不是说<body>不能包含抽象内容，它可以，只是它不想。你硬要把抽象内容写进去也勉强行，但它更在乎看得见摸得着的。<head>不要，但<body>很诚实。
title标签
<title>标签用于指定浏览器标签上显示的标题，是个概括整张网页的存在;<title>中只可包含文本，若是包含标签，则包含的任何标签都会按源代码显示（浏览器不解释）。对搜索引擎来说<title>信息的重要性是无与伦比的，所以<title>中的信息要尽可能简洁准确。
h1-h6标签
<h1>，<h2>，<h3>，<h4>，<h5>，<h6>都是标题标签，用于概括页面中不同主题的内容，其中<h1>最大，<h2>其次，依次类推，没有<h7>。
p标签
<p>是段落标签（paragraph的缩写），用于给文字划分段落，一组<p>元素为一个段落一张网页可有多个<p>标签。<p>中可以存在子元素。
div标签
- 是用于在网页中划分区域的（division的缩写），通常作为容器而存在，用于包含网页中的内容, 是最常用的网页元素之一。
- div>的特点是非常纯粹，在没有明确指定的情况下没有边框，没有填充，没有边距，完全透明，在标签中没有内容的情况下高度为零，完全不可见，它的高度随身体里的内容而定，内容多就高内容少就低，可以说是个完美的容器，想象一个完全透明、没有质量、体积为零但容积自由伸缩无限、质量还极好的塑料袋，就是个这样的存在
- ： 只是一个块级元素，并无实际的意义。主要通过CSS样式为其赋予不同的表现.
： 表示了内联行(行内元素),并无实际的意义,主要通过CSS样式为其赋予不同的表现. - 块级元素与行内元素的区别
所谓块元素，是以另起一行开始渲染的元素，行内元素则不需另起一行。如果单独在网页中插入这两个元素，不会对页面产生任何的影响。
这两个元素是专门为定义CSS样式而生的。
a标签
<a>用于定义网页中的链接，链接也叫做锚或锚链接，而<a>即是anchor（锚）的缩写。所谓的超链接是指从一个网页指向一个目标的连接关系，这个目标可以是另一个网页，也可以是相同网页上的不同位置，还可以是一个图片，一个电子邮件地址，一个文件，甚至是一个应用程序;
```‘‘‘<a href="" target="_blank" >click</a>href属性指定目标网页地址。该地址可以有几种类型： ???绝对 URL - 指向另一个站点（比如 href="http://www.jd.com） ???相对 URL - 指当前站点中确切的路径（href="index.htm"） ???锚 URL - 指向页面中的锚（href="#top"）‘‘‘```img标签
<img>用于定义网页中的图片。我们平常在网页中见到的大部分图片都是用这个标签定义的。其中src（source）是<img>标签的一个属性，用于指定图片的地址。没有结束标签， 只有结束标签；`<img src="img/1.gif" alt="你好世界">`alt属性是在不能加载图片时候显示的内容，介绍图片；
列表标签
```‘‘‘<ul>: 无序列表 [type属性：disc(实心圆点)(默认)、circle(空心圆圈)、square(实心方块)]<ol>: 有序列表 ????????<li>:列表中的每一项.<dl> ?定义列表 ????????<dt> 列表标题 ????????<dd> 列表项‘‘‘```table标签
<table>标签用于定义表格，单独出现并没有什么用，它需要和他专有的子标签在一起才有意义。<table>的子标签有：<tr>（table row）：定义行，出现一组就是一行，出现多组就是多行。<td> （table data）：定义单元格，一般包含在<tr>中。<th> （table head cell）：定义表头单元格，一般包含在<thead>中。<thead> （table head）：定义表头，见例子。<tbody> （table body）：定义表身，见例子。
```<table border="1"> <!--表格开始--> ?<tr> <!--第一行开始--> ???<td>王花花</td> ???<td>21岁</td> ?</tr> <!--第一行结束--> ?<tr> <!--第二行开始--> ???<td>李拴蛋</td> ????<td>19岁</td> ?</tr> <!--第二行结束--></table> <!--表格结束-->``````<table border="1"> ?<thead> <!--表头开始--> ???<tr> ?????<th>姓名</th> ?????<th>年龄</th> ?????<th>取向</th> ???</tr> ?</thead> <!--表头结束--> ?<tbody> <!--表身开始--> ???<tr> ?????<td>王花花</td> ?????<td>21</td> ?????<td>拴蛋</td> ???</tr> ???<tr> ?????<td>李拴蛋</td> ?????<td>19</td> ?????<td>花花</td> ???</tr> ?</tbody> <!--表身结束--></table>```header标签
<header>和<footer>本身和<div>没有任何区别，仅仅是字面上的区别，但使用它们可以让浏览器和搜索引擎更好的解读你的网页，同时也更有利于维护（一看就知道是页头页脚。
标签用于定义页头，也就是页面中的引导性内容
link和script标签
<link>标签用于加载外部资源（也就是不属于本页面的资源，比如样式表、雪碧图之类），<script>标签用于加载脚本（一般为JavaScript）。
```<head> ???<link href="base.css"> ???<script src="base.js"></script></head>```button标签
提交时用 还是
abbr标签
缩写
<abbr title="Mother Money Payment">mmp</abbr>
code和pre标签
<code>一般用于小段代码。<pre>用于表示文字在编辑时的状态，比如在编辑器里的状态，所以一般被用于大段代码的展示，因为“所见即所得”。
input标签
<input>的类型比较多，每一种侧重于不同的数据类型和结构：<input type="text"> 默认值（可以不填type属性），用于输入文字，如用户名，昵称等等。<input type="password"> 密码输入，我们平时输密码时的小黑点就是这么来的。<input type="radio"> 单选框，在需要用到单选但选项少的情况下使用。如性别（只有两个选项）。<input type="checkbox">多选框（复选框），在需要用到多选但选项少时使用，多选，但是选项少的情况下使用。如性取向。<input type="file"> 选择文件，上传文件必用。<input type="reset"> 重置表单。<input type="hidden" value="秘密">隐形输入框，一般用于在表单提交时回传重要的令牌（就是一串自产自销的无序字符）来验证用户是真的或状态是对的。<input type="button" value="点我">按钮，不推荐，正常情况下使用<button>即可，因为<button>可以包含子元素，而<input>不行，灵活度的问题
```# 单选框<label> ?<input type="radio" name="sex" value="male"> ?男</label><label> ?<input type="radio" name="sex" value="female"> ?女</label># 多选框<p>请选择你的性取向<p><label> ?<input type="checkbox" name="sex" value="male"> ?男</label><label> ?<input type="checkbox" name="sex" value="female"> ?女</label># 选择文件<p>请选择文件<p><input type="file" name="avatar"># 表单提交， 最好用buton标签<form> ?姓名：<input> ?<br> ?年龄：<input> ?<input type="reset" value="点我重置"></form>```