HTML
head头部标签里面的内容：
1.自闭合标签（title）
<title>这是我的博客</title> # 用于标记导航中的名字
2.自闭合标签（meta）
<meta charset="UTF-8"> # 用于指定 字符编码
<meta http-equiv = "Refresh" content="3" /> # 页面刷新 3 秒钟刷新一次
<meta name="keywords" content="北京,北京汽车,北京报价" /> # 易于搜索引擎搜索
<meta name="description" content="汽车之家北京报信息尽在汽车之家报价库" /> # 网站的描述信息
<meta http-equiv="X-UA-Compatible" content="IE=edge"> # 设置IE浏览器兼容提醒 请使用 IE=edge 版本打开
<meta http-equiv = "Refresh" content="3; Url = http://www.baidu.com" /> # 设置页面3秒后 跳转到 baidu.com 用的少
3.自闭合标签（link）
<link rel="shortcut icon" href="image/favicon.ico"> # 设置页面导航的角标 格式为ico
<link rel="stylesheet" href="static/commons.css"> # 用于引用其他路径的css样式
4.自闭合标签（style 可以用link标签从一个路径引用）
<style>
#i1{ # 用于定义css样式格式的
background-color: red;
height: 48px;
}
</style>
5.自闭合标签（script）
body本体标签里面的内容：
所有的标签分为：
- 块级标签 H 系列标签，p标签，div标签（一个块级标签会默认占一整行）
- 行内标签 span标签，select标签，a标签 等（可用于css自定义标签，默认不换行）
- 标签存在的意义： 用于CSS操作，JS操作
1.HTML特殊字符编码大全：往网页中输入特殊字符，需在html代码中加入以&开头的字母组合或以&#开头的数字
http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html
例：
# 不断行的空白
© © # 版权
® ® # 已注册
p 和 br标签
p表示段落，默认段落之间是有间隔的！
<p>ddddddddddddddddddddddddaaaaaaaaaaaaa</p>
br 是换行 不会有换行段落间隔（自闭合标签）
dddddddddddddddddddddddaaaaaaaaaaaaaas<br>adddddddddddddddddddddddddddddddddddaaa
H 标签
H1 ... H6 标题标签从 H1到H6 递减
span 行内标签
span 白板标签，可用于css自定义标签
div 标签
div标签 也是白板标签，可用于css自定义标签
标签之间可以嵌套
标签存在的意义，css操作，js操作
form表单（可将数据提交到后台的标签）【重点】
1. 向自己的服务端提交数据 “post”会把内容放在请求体中发送过去； 2. “get”提交会把数据放在url中提交过去（默认依照“get”方式提交）； 3. enctype当提交的内容有文件时需要依赖此选项； 4. 需要提交的内容都需要放在form标签内部。<form method="post" action="http://127.0.0.1:8080/edit_user" enctype="multipart/form-data">
# method 依照什么方法将数据提交给服务端 （post或get）
# get 默认将数据通过url发送到服务端
# post 将数据放在 body 中发送给服务端
# action 用于向服务端提交数据的地址
# enctype 提交文件时需要此参数
<input type="text" name="user"/>
# 向后台提交数据时，需要在input标签中 设置name="user" 以便后台获取前台提交的数据
<input type="text" name="email"/>
<input type="password" name="pwd"/>
<input type="button" value="提交1"/> # 默认没有任何用处只是个按钮(可用于属性自定义)
<input type="submit" value="提交2"/> # 用于向后台提交表单
</form>
2.向搜狗搜索提交数据
<form method="get" action="https://www.sogou.com/web">
<input type="text" name="query"/>
<input type="submit" value="提交" />
</form>
1.input 系列（可将数据提交到后台的标签）
类型：（type）
- type="text" 表示普通文本
- type="password" 表示密码格式
- type="button" 普通按钮
- type="submit" form表单提交按钮将数据提交到后台
- type="radio" 单选框
- type="checkbox" 复选框
- input type="file" 文件提交（依赖form表单中的一个属性 enctype="multipart/form-data"）
单选框radio
男：
女：
男：<input type="radio" name="gender" value="1" checked="checked" />
# type="radio"表示单选框；name="gender" name 相同能达到互斥作用；
# checked="checked" 表示默认选中；value="1" 表示选中后的value值
女：<input type="radio" name="gender" value="2"/>
按钮submit
需要包含在form标签内部，用于数据提交；
<input type="submit" value="提交"/>
# type="submit" 将数据提交到后台
<input type='rest' />
# type='reset' 用于重置输入内容的按钮
复选框 checkbox
篮球：
1球：
2球：
3球：
4球：
篮球：<input type="checkbox" name="favor" value="1" checked="checked" />
# type="checkbox" 为复选框；checked="checked"表示为默认选中；
# name="favor" name值相同，后台获取数据为列表形式favor:[1,2,3]
1球：<input type="checkbox" name="favor" value="2"/>
2球：<input type="checkbox" name="favor" value="3" checked="checked" />
3球：<input type="checkbox" name="favor" value="4"/>
4球：<input type="checkbox" name="favor" value="5"/>
文件上传
文件上传：
<input type="file" />
# 表示上传文件 依赖form表单中的一个属性 enctype="multipart/form-data"
# <form method="post" action="http://127.0.0.1:8080/edit_user" enctype="multipart/form-data">
注释：
input type="text" name="user" # text 普通文本 name 指定一个key值，用于服务端取值
input type="password" name="pwd" # password 密码格式
input type="button" value="提交1" # button 普通的按钮 value 表示按钮上面的值
input type="submit" value="提交1" # submit 提交按钮，将表单提交
input type="radio" name="gender" value="1" checked="checked" # radio 单选框，name 相同时达到互斥的作用 checked="checked" 表示默认选中
input type="radio" name="gender" value="2"
input type='file' # 表示上传文件 依赖form表单中的一个属性 enctype="multipart/form-data"
input type='reset' # 重置
篮球：<input type="checkbox" name="favor" value="1" checked="checked" />
# type="checkbox" 为复选框；checked="checked"表示为默认选中；
# name="favor" name值相同，后台获取数据为列表形式favor:[1,2,3]
1球：<input type="checkbox" name="favor" value="2" checked="checked"/>
2球：<input type="checkbox" name="favor" value="3"/>
2.textarea 多行文本框（可将数据提交到后台的标签）
<textarea name="texrea">多行文本框</textarea>
# “多行文本框”中间内容为默认值
# 后台拿去数据通过 name="texrea" 获取值
3.select 下拉框系列（可将数据提交到后台的标签）
1.下拉单选框
<select name="danxuan">
<option value="北京">北京</option>
<option value="天津" selected="selected">天津</option>
# selected="selected" 表示默认选中
<option value="南京">南京</option>
<option value="东京">东京</option>
</select>
2.下拉多选框 multiple
<select name="duoxuan" size="5" multiple="multiple">
# size="5" 框的大小；
# multiple="multiple"多选框
<option value="北京">北京</option>
<option value="天津" selected="selected">天津</option>
<option value="南京">南京</option>
<option value="东京">东京</option>
</select>
a标签（不能提交到数据库）
1.实现超链接 跳转功能
<a href="http://www.baidu.com" target="_blank">百度</a>
# href 特有的属性用于跳转的页面；
# target="_blank" 在新窗口页打开
2.锚点（用于跳转到指定的段落）
```html
第一章
# 在href="#i1"中指定 段落的 ID地址
第二章
第三章
第四章
```
第一章内容
# id 值应该唯一
# style="height: 600px" 高设置为600px才能看出效果
第二章内容
第三章内容
第四章内容
image图片标签
src="Lighthouse.jpg" # 图片地址
style="height: 200px; 200px" # 设置图片的宽高
alt="美女" # 当图片不存在时，显示文字
title="大美女" # 鼠标停放在上面显示的文字
<a href="http://pic.zhangyu.tv/upload/1553869728626391.jpg" target="_blank">
# 在a标签中包裹 img标签，可以实现点击图片跳转的作用
<img src="Lighthouse.jpg" style="height: 200px; 200px" alt="美女" title="大美女">
</a>
ul 和 ol列表标签
- 123
- 123
- 123
- 123
- # ol 数字序列 1.2.3...
- 123
- 123
- # ul 依照 • 开头
- 123
- 123
| 主机名 | 地址 | 端口 | 选项 |
|---|---|---|---|
| MySQL | 1.1.1.1 | 80 |
<table border="1"> <!-- 创建一个表格 -->
<thead> <!-- 这是一个表头 -->
<tr> <!-- 这是一行 -->
<th>主机名</th> <!-- 这是一列,th加粗的头 -->
<th>地址</th>
<th>端口</th>
<th>选项</th>
</tr>
</thead>
<tbody> <!-- 这是一个表本体 -->
<tr> <!-- 这是一行 -->
<td>MySQL</td> <!-- 这是一列，普通的列 -->
<td>1.1.1.1</td>
<td>80</td>
<td><input type="checkbox" value="2"/></td>
</tr>
</tbody>
</table>
label标签用于名称和input框获取光标
<label for="usernames">用户名</label> # for="username" 来自于那个 id
<input id="usernames" type="text" name="user"/> # 定义一个input标签 id为“username”