一、a标签的用法
href属性
作用：
- 跳转到内部页面
- 跳转到内部锚点
- 跳转到邮箱、电话
取值：
1.网址
https：//google.com
https：//google.com
//google.com（只用这一种方法书写，会自动跳转到正确的网址)
2. 路径
/a/b/c:绝对路径，a前面的/表示http服务开启的根目录
a/b/c：相对路径 index.html以及./index.html：是一样的，都是在当前目录打开
3.伪协议
javascript : ;（点击链接什么也不做）
mailto ：邮箱--->跳转到邮箱
tel ：手机号--->打电话
4.加id
#xxx ：会跳转到这个id
target属性
作用：指定在哪个窗口有打开链接
值：
- _self：默认值，在当前页面打开
- _blank：新建空白页面打开
- _top：当前页面顶级窗口打开
- _parent：链接所在上一层打开
- target = xxx：一直在名为xxx的页面打开
download属性：理论上是下载这个网页，基本不用
rel=noopener属性
二、img标签
作用：发出get请求，展示一张图片
属性：
- src：图片地址
- alt：在图片加载失败时显示的文字，用来提示用户
- height：高度，只写高度时宽度会自适应
- width：宽度，只写宽度时高度会自适应
注意：图片一定不能变形
事件：监听图片加载是否成功
onload 成功
onerror 失败 失败的时候可以加载一个代替图片，提示用户
响应式
max-width = 100%
三、table标签
table标签里面只能有三个标签：thead、tbody、tfoot；这三个标签跟书写顺序无关，只会按照头部-->身体-->脚部这种形式显示
th表示表头
tr表示table row（行）
原代码
<thead>
<tr>
<th></th>
<th>小王</th>
<th>小明</th>
</tr>
<tbody>
<tr>
<th>数学</th>
<td>90</td>
<td>80</td>
</tr>
<tr>
<th>语文</th>
<td>90</td>
<td>80</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>总分</th>
<td>270</td>
<td>240</td>
</tr>
</tfoot>
</thead>
</table>
显示效果
相关的样式
- table-layout：
auto：默认样式，根据内容决定宽度
fixed：宽度尽量平均 - border-collapse = collapse（控制border是否合并）
- border-spacing = 0（表示边框缝隙为0）
- 下面这个两个样式一般写入css.reset
四、form标签
作用：发出get或者post请求，然后刷新页面
属性
- action：控制请求到哪个页面
- method：控制用post还是get请求
- autocomplete：值是on/off，表示是否自动填充
- target：决定提交到哪个页面
事件：onsubmit
注意事项： - form表单中必须要有 type = submit
区别 ：
<input type="submit" value="提交"> //不写value默认值是"提交"。里面不能有其他标签
<button type="submit">提交</button> //里面可以加任何东西（其他标签，图片等等）
五、input标签
type属性
值：
- text文本
- color颜色
- password：不显示文本，用小黑点显示
- radio：单选按钮，要有相同的name
- checkbox：多选按钮，要有相同的name
- file：选择单个文件
- file+multiple：选择多个文件
- hidden：看不见的
textarea标签 写多行文本
select选择表单
原代码
<select name="" id="">
<option value="">请选择</option>
<option value="1">星期一</option>
<option value="2">星期二</option>
</select>
显示效果
事件
- onchange：改变
- onfocus：聚焦
- onblur：失焦
验证器：HTML5新增功能
注意事项 - 一般不监听input的click事件
- form里面的input必须要有name
- form里面放一个type = submit才能触发
六、其他注意事项
永远不能双击打开HTML文件，要输入网址打开
配置终端，两种方法
一、
- yarn global add http-server--->下载安装
- http-server . -c-1（注意 .前后都有空格；可以缩写为hs . -c-1）--->在地址后面加上HTML路径 二、
- yarn global add parcel
- parcle + html地址
