a标签
href属性
href-超链接包含超链接指向的 URL 或 URL 片段。
href不同取值可以跳转不同外部页面和内部锚点以及邮箱电话
- google.com
- google.com
- //google.com，默认按跳转前的网站的前缀
- /a/b/c绝对路径永远从/开始
- a/b/c相对路径在当前目录寻找
- 关于4,5，在文件操作中，/表示系统根目录，但是我们开启了http服务，/就变成了开启http服务的那个目录解释了为什么我们不直接双击打开html文件，若双击则会变成
file:///C:/Users/dell/Desktop/project/1.html这种形式，如果此时href的值为/a/b则电脑会从系统根目录中查找。同理在github部署到pages时刚开始会显示404，之后加路径即可 - 也可以是一段伪协议JavaScript:代码;用来点击链接执行一段JavaScript代码，例如
<a href="JavaScript:代码;">JavaScript伪协议</a> - 若href的值为空那么点击该链接页面会刷新
- 通常
<a href="JavaScript:;">JavaScript伪协议</a>代码为空，点击该链接页面不会发生任何变化，使得点击a标签时不发生任何变化的唯一办法 - href="#xxx"点击后就会自动跳转到IDxxx
<a href="#xxx;">跳转到xxx</a> - 伪协议mailto:邮箱，点击该链接就会发邮件
- 伪协议tel:手机号，点击即弹出拨号界面并填充手机号
target属性
target属性，该属性指定在何处显示链接的资源。
- _self: 当前窗口，当前框架加载。此值是默认的，如果没有指定属性的话。
- _blank: 新窗口打开
- _parent:加载响应到当前框架的HTML4父框架或当前的HTML5浏览上下文的父浏览上下文。如果没有parent框架或者浏览上下文，此选项的行为方式与 _self 相同，涉及到iframe标签。
- _top:加载响应进入顶层浏览上下文，涉及到iframe标签该标签可以引用另一个页面，外面的窗口包裹住iframe里面的窗口，外面的层数高，谷歌浏览器不允许在iframe中打开
- target="xxx"一个名字为xxx的窗口打开，若没有就新建，可以把iframe元素用name属性命名
<a href="//google.com" target="xxx">跳转到谷歌</a>
<a href="//baidu.com" target="xxx">跳转到百度</a>
<iframe src="" name="xxx" ></iframe>
在框架中打开链接
rel属性
rel该属性指定了目标对象到链接对象的关系，尽管浏览器不会以任何方式使用该属性，不过搜索引擎可以利用该属性获得更多有关链接的信息
table标签
<table></table> 整个表格元素
<thead></thead> 表头元素嵌套在table标签里
<tbody></tbody> 表格嵌套在table标签里
<tfoot></tfoot> 表尾嵌套在table标签里
<tr></tr> 表格一行嵌套在thead和tbody中
<th></th> 表头嵌套在tr中
<td></td>表格嵌套在tr中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
</head>
<body>
<table>
<thead>
<tr>
<th></th>
<th>小红</th>
<th>小明</th>
<th>小颖</th>
</tr>
</thead>
<tbody>
<tr>
<th>数学</th>
<td>61</td>
<td>91</td>
<td>85</td>
</tr>
</tbody>
<tbody>
<tr>
<th>数学</th>
<td>61</td>
<td>91</td>
<td>85</td>
</tr>
</tbody>
<tbody>
<tr>
<th>数学</th>
<td>61</td>
<td>91</td>
<td>85</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>总分</th>
<td>200</td>
<td>200</td>
<td>200</td>
</tr>
</tfoot>
</table>
</body>
</html>
空 小紅 小明 小颖
数学 61 91 85
数学 61 91 85
数学 61 91 85
总分 200 200 200
table样式
table-layoout，CSS属性定义了用于布局表格单元格，行和列的算法。
- table-layout: auto，大多数浏览器采用自动表格布局算法对表格布局。表格及单元格的宽度取决于其包含的内容。根据内容不平均
- table-layout: fixed，表格和列的宽度通过表格的宽度来设置，某一列的宽度仅由该列首行的单元格决定。在当前列中，该单元格所在行之后的行并不会影响整个列宽。尽量平均
border-collapse， CSS 属性是用来决定表格的边框是分开的还是合并的。在分隔模式下，相邻的单元格都拥有独立的边框。在合并模式下，相邻单元格共享边框。
- 合并（collapsed ）模式下，表格中相邻单元格共享边框。
- 分隔（separated）模式是HTML表格的传统模式。相邻单元格都拥有不同的边框。边框之间的距离是通过CSS属性 border-spacing 来确定的。
img标签
img 元素将一份图像嵌入文档，发出get请求，展示图片。
src属性
src 属性是必须的，它包含了你想嵌入的图片的文件路径，可以是路径也可以是网页
alt属性
alt属性包含一条对图像的文本描述，这不是强制性的，但对可访问性而言，它难以置信地有用——屏幕阅读器会将这些描述读给需要使用阅读器的使用者听，让他们知道图像的含义。如果由于某种原因无法加载图像，普通浏览器也会在页面上显示alt 属性中的备用文本
width、height属性
单独写一个属性另一个会自适应，若两个都赋值那么图片会变形，尽量不要使图片变形
form标签
form元素表示了文档中的一个区域，此区域包含有交互控制元件，用来向Web服务器提交信息，发get和post请求然后刷新页面，通常有select，input，text，textarea，label输入标签
action属性
一个处理此表单信息的程序所在的URL。
method属性
浏览器使用这种 HTTP 方式来提交 表单. 可能的值有：
post：指的是 HTTP POST 方法；表单数据会包含在表单体内然后发送给服务器.
get：指的是 HTTP GET 方法；表单数据会附加在action属性的URI中，并以'?'作为分隔符，然后这样得到的URI再发送给服务器。如果这样做（数据暴露在URI中）没什么副作用，或者表单仅包含ASCII字符时，再考虑使用这种方法吧。
input标签
用于为基于Web的表单，以便接受来自用户的数据;
input的name:属性input的名字，在提交整个表单数据时，可以用于区分属于不同input的值
input的type:要呈现的控件类型。
autocomplete属性
代表如果input元素的 type 允许，则会具有根据input的name属性自动填充的功能，有两个值on和off
target属性
由于表单会刷新页面所以会用到target属性表示把哪个页面变成提交后的页面
button标签
元素表示一个可点击的按钮，可以用在表单或文档其它需要使用简单标准按钮的地方。
<button type="submit">搞起</button>
<input type="submit" value="搞起"/>两者区别在于button里面可以嵌套标签，input不可以
form里面必须要有一个type=submit的按钮
textarea标签
多行输入文本
select标签
配套option标签使用
<select>
<option value="">请选择</option>
<option value="1">星期一</option>
<option value="1">星期二</option>
</select>
input标签详解
type属性
- text 文本
- color 颜色
- password 不展示文本
- radio 单选（只有同一个name才可以单选）
<input type="radio" name="sex" />男 <input type="radio" name="sex" />女 - checkbox 多选（同一个name表示一组）
- file 一个文件
<input type="file" multiple />多个文件 - hidden 隐藏，通常给机器使用
- submit 提交，一个表单必须有一个
name属性
input需要有name
待补充: http协议
