1、HTML：超文本标记语言
2、HTML标签不区分大小写，但建议小写。所有内容都使用标签完成，不是标签的，浏览器会作为纯文本来解析（HTML解析引擎中只认标签）
3、<head></head>标签用于定义文档的头部，它是所有头部元素的容器。头部中定义的都是网页的一些辅助信息，以及需要先加载的内容。
4、头部元素有<title>、<script>、<style>、<link>、<meta>等标签
<head>
<title></title>
<meta />
<link />
<style></style>
<script></script>
</head>5、<标签名 属性名1="属性值1" 属性名2='属性值2'> 内容 </标签名>
注：一般使用双引号。双引号中可以嵌套单引号，单引号中也可以嵌套双引号，但单引号和双引号都必须成对出现
6、操作思想：对数据进行不同标签的封装，通过标签中的属性对封装的数据进行操作（标签就相当于一个容器）
7、列表标签
作用：格式化数据
（1）列表标签
<dl>
<dt>上层项目内容</dt>
<dd>下层项目内容：有自动缩进效果</dd>
<dd>下层项目内容：有自动缩进效果</dd>
</dl>（2）有序的项目列表
<ol>
<li>有序的项目列表</li>
<li>有序的项目列表</li>
</ol>（3）无序的项目列表
<ul>
<li>无序的项目列表</li>
<li>无序的项目列表</li>
</ul>8、表格标签<table>
作用：格式化数据
（1）基础表格
<!-- cellpadding是单元格的内边距，即 单元格内的文字距单元格上下左右边的距离 -->
<!-- cellspacing是单元格与单元格之间的距离 -->
<table border="1" border-color="#0000ff" cellpadding="10" cellspacing="0" width="500">
<!-- 表格标题，默认居中 -->
<caption>表格标题</caption>
<tr>
<!-- th：默认加粗并居中 -->
<th>第一行第一列标题</th>
<th>第一行第二列标题</th>
</tr>
<tr>
<!-- td：默认居左 -->
<td>第二行第一列内容</td>
<td>第二行第二列内容</td>
</tr>
</table>（2）不规则表格：左右合并、上下合并
<!-- 不规则的表格，先数有多少行，再判定每一行有多少个单元格 -->
<table border="1" border-color="#0000ff" cellpadding="10" cellspacing="0" width="500">
<caption>不规则表格标题</caption>
<tr>
<!-- colspan：合并列（左右合并） -->
<th colspan="2">第一行：左右合并后的标题</th>
</tr>
<tr>
<td>第二行第一列内容</td>
<td>第二行第二列内容</td>
</tr>
</table>
<br />
<table border="1" border-color="#0000ff" cellpadding="10" cellspacing="0" width="500">
<caption>不规则表格标题</caption>
<tr>
<!-- rowspan：合并行（上下合并） -->
<th rowspan="2">第一行第一列：上下合并后的标题</th>
<td>第一行第二列内容</td>
</tr>
<tr>
<td>第二行第二列内容</td>
</tr>
</table>（3）表格分体：分段加载、显示
<table>
<!--
表格分体，一个<table>有一个<thead>和一个<tfoot>，可以有多个<tbody>。<table>可以按结构一块块的显示，不用等整个表格加载完后显示
如果没有表格分体，<table>要全部加载完之后才能显示
有了表格分体，<tbody>中的内容加载完优先显示，不用等到全部<table>都加载完再显示
如果表格内容很多，可以用多个<tbody>分段，一部分一部分的加载、显示
-->
<thead></thead>
<!-- table的下一级标签是tbody，不写也有（默认） -->
<tbody>
</tbody>
<tbody>
</tbody>
<tfoot></tfoot>
</table>9、超链接标签<a>
（1）<a href="指定资源，必选属性，不写该属性没有点击效果。值为空默认打开当前文件所在目录" target="打开方式。默认在当前页打开，_blank是在新页面打开" title="鼠标滑过链接时，会显示该属性的值（文本内容）。在实际开发中，主要是为了方便搜索引擎了解链接地址的内容（语义化更友好）">xxx</a>
注：有了href属性，才有了点击效果。href属性的值的不同，解析方式也不同。如果该值中没有指定过任何协议，解析时按照默认协议来解析该值，默认的协议是file协议
（2）超链接的作用：
a. 连接资源
b. 定位标记（锚）
<!-- 定位标记（锚） -->
<a name="top">顶部位置</a>
<hr />
<a name="center">中间位置</a>
<hr />
<a href="#top">回到顶部位置</a>
<a href="#center">回到中间位置</a>10、框架标签<frameset><frame />
框架标签不要写在<body>中，它不属于主体中的内容，要单独定义出来
<!-- 先上下分，用rows -->
<frameset rows="30%, *">
<frame src="top.html" name="top"/>
<!-- 下面的再左右分，用cols -->
<frameset cols="30%, *">
<frame src="left.html" name="left" />
<frame src="right.html" name="right" />
</frameset>
</frameset
<!-- left.html中，有超链接<a>，想让超链接的内容在右侧显示，需要给每个<frame>添加name属性（起个名字），以便准确定位 -->
<a href="链接文件的相对地址" target="<frame>标签中name属性的值，若在右侧显示，值为right"></a>11、画中画标签<iframe>
（1）可以在窗体的任意位置打开一个区域，并链接资源进去
（2）<iframe src="链接的资源" height=0 width=0>如果看不到该文字，说明浏览器不支持iframe标签</iframe>
注：height、width都是0，你看不到任何东西（画中画窗体的宽高都是0），但是访问了src链接的资源，可能是恶意文件。多看看状态栏访问的网址是否是正确的网址
12、表单标签<form>
（1）表单标签是最常用的标签，用于与服务器端的交互
（2）<input>标签：type属性的值（10种）
<form>
<!--
如果要向服务端提交数据，表单中的组件都必须具备name和value两个属性（需要用户输入值的组件，其value属性可省略）。value是要提交到服务器的数据
用于给服务端获取数据方便
-->
<input type="text\password\radio\checkbox\reset\submit\file\image\hidden\button" name="xxx" value="xxx，需要用户输入值的组件，其属性可省略" />
<!-- 单选按钮radio：一次只能选一个，要把选项放在一个组里面，用name属性标识是否是同一个组 -->
<input type="radio" name="xxx" value="xxx" ckecked="checked，可选择的属性，加上ckecked属性表示默认被选中" />页面显示的文字
<!-- 复选框 -->
<input type="checkbox" name="xxx" value="xxx" ckecked="checked，可选择的属性，加上ckecked属性表示默认被选中" />页面显示的文字
<!-- 重置：将所有表单中的组件进行状态的还原 -->
<input type="reset" value="按钮上显示的文字" />
<!-- 提交：将数据提交到服务端（如果没有指定服务端，数据会提交到当前页面） -->
<input type="submit" value="按钮上显示的文字" />
<!-- 选择文件 -->
<input type="file" name="file" />
<!-- 图片，具备提交的效果，和submit的效果一样，但比submit漂亮 -->
<input type="image" src="图片地址" />
<!-- 隐藏组件：开发时很常用。数据不需要客户端知道，但是需要将其提交到服务端 -->
<input type="hidden" name="xxx" value="xxx" />
<!-- 按钮：不具备默认的处理方式，可以自定义点击事件效果 -->
<input type="button" value="按钮上显示的文字" onclick="点击触发的事件" />
</form>（3）<select>标签：下拉菜单
<form>
<!-- 下拉框 -->
<select name="xxx">
<!-- 每一个下拉菜单选项都必须用<option>封装 -->
<option value="xxx1" selected="selected，可选择的属性，加上selected属性表示默认被选中"></option>
<option value="xxx2"></option>
<option value="xxx3"></option>
</select>
</form>补：下拉列表的多选操作
在<select>标签中设置multiple="multiple"属性，然后在Windows操作系统下，按Ctrl键同时进行单击（Mac下使用Command+单击），可以选择多个选项
（4）<textarea>标签：文本框
<form>
<!-- 文本框 -->
<textarea name="xxx"></textarea>
</form>（5）<form>标签的属性
a). action：指定数据要提交到服务端的位置。如果没有指定服务端，数据会提交到当前页面
b). method：提交方式，有get和post两个值。method属性省略不写，默认使用get方式
注：所有表单控件都必须放在<form>表单中，否则用户输入的信息提交不到服务端
（6）get提交和post提交的区别
a). get提交，提交的信息都显示在地址栏中
post提交，提交的信息不显示在地址栏中
b). get提交，对于敏感的数据信息不安全
post提交，对于敏感信息安全
c). get提交，对于大数据不行，因为地址栏存储体积有限
post提交，可以提交大体积数据
d). get提交，将信息封装到了请求消息的请求行中
post提交，将信息封装到了请求体中
补充：在服务端的区别
如果出现将中文提交到tomcat服务器，服务器默认用ISO8859-1进行解码，会出现乱码。先通过ISO8859-1进行编码，得到中文的原码，再用指定的中文码表解码即可。这种方式对get提交和post提交都有效
但是对于post提交方式 提交的中文，还有另一种解决办法，就是直接使用服务端的request对象的setCharacterEncoding()方法，直接设置指定的中文码表，就可以将中文数据解析出来
注：request对象的setCharacterEncoding()方法，只对请求体中的数据进行解码
综上，表单提交，建议使用post
13、和服务端交互的三种方式
（1）地址栏输入url地址（get）
（2）超链接（get）
（3）表单（get或post）
14、客户端和服务端的校验问题
（1）问：如果在客户端进行了增强型的校验（只要有一个组件的内容是错误的，就不能继续提交 -- 只有全部正确才可以提交），服务端收到数据后，还需要校验吗？
答：需要，为了安全性。
（2）问：如果服务端做了增强型的校验，客户端还需要校验吗？
答：需要，因为要提高用户的上网体验效果，同时减轻服务器端的压力
15、<head>中的标签
（1）<title>：浏览器标题栏显示的内容
（2）<base href="网页中所有超链接的目录，可以是本地目录或网络目录。只作用于相对路径的超链接文件" target="打开超链接的方式，_blank表示所有的超链接都用新窗口打开">
注：<base>针对的是页面中的所有超链接，设置它们链接资源的位置，以及打开资源的方式
（3）<meta name="网页的描述信息。当取keywords时，content属性的内容就作为搜索引擎的关键字进行搜索" http-equiv="模拟http协议的响应消息头，后面用服务端实现" />
eg：
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<meta http-equiv="refresh" content="3; url=xxx" />：表示打开此页面3秒后自动跳转到xxx，常用于注册完网站之后的跳转
<meta http-equiv="refresh" content="1" />：每隔1秒钟刷新一次页面，可用于股票大盘的显示
（4）<link href="链接进来的目标文档" ref="目标文档与当前文档的关系" type="文档类型" media="指定目标文档在哪种设备上起作用">
16、其他标签
（1）<h1>：标题，一般被用在网站名称上
（2）<p>：段落，段落前和段落后都会有空白。可以用css样式删除或改变这些空白
（3）<img src="图片地址" alt="图片说明文字：图片下载失败时的替换文本或鼠标放在图片上时显示的文字（必选属性）" title="提示文本" />
注：图片是单独的文件数据，网页是单独的文件数据，在网页中指定了图片的位置，浏览器对图片的位置进行解析并将图片展示出来。所以，访问页面时发送两次请求，一次请求html页面，另一次请求图片数据
（4）<q>：短文本引用。浏览器会对<q>标签中的内容自动添加双引号（头和尾处）
（5）<blockquote>：长文本引用。浏览器对<blockquote>标签的解析是缩进样式，即每行前后都有缩进
（6）<pre>：预格式化文本（元素中的内容保持原样显示）。被包围在<pre>元素中的文本通常会保留空格和换行符。如果需要在网页中预显示格式时，可以使用<pre>。<pre>一个常见的应用是用来展示计算机的源代码，即 <pre>多行语言代码段</pre>
（7）<code>：<code>一行代码语言</code>，即<code>中的内容在一行显示
（8）<marquee direction="运动的方向，例如：down，从上向下运动" behavior="运动的方式，例如：slide（较常用），单次运动，运动完之后停在某个位置">显示的内容</marquee>：能运动的标签，用于打开网站时看到的会移动的公告
17、HTML、XHTML和XML
（1）XHTML：可扩展的超文本标记语言
（2）XML：可扩展标记语言（不是超文本）
（3）HTML和XML的区别
a). HTML标签名全都是固定的
XML标签名是可以自定义的
b). HTML提供标签对数据进行封装，是数据显示的描述
XML是对数据的信息进行描述，描述的是数据之间的关系
c). XML更为严格，标签不结束被视为错误。XML规范可以被更多的应用程序所解释，将成为一种通用的数据交换语言。各个服务器、框架都将XML作为配置文件
18、标签分为两大类：
（1）块级标签/元素：标签结束后都有换行。<div>、<p>、<dl>、<dt>、<dd>、<table>、<title>、<ol>、<ul>
（2）行内标签/元素：标签结束后没有换行。<font>、<span>、<img>、<input>、<select>、<a>