一、a标签
属性
href/ target/ dowload/ rel=noopener
作用
- 跳转到外部页面
- 跳转内部锚点
- 跳转到邮箱或者电话
1.a-href
取值：
-
网站：
- 只写//google.com
- 首先使用当前页面的协议访问地址 → http://www →https://www.
<a href="//google.com">访问谷歌</a> -
路径
- /a//b/c.html和a/b/c.html区别（/a/b/c如果用文件形式打开html会去绝对路径找例如d:/a/b/c.html，使用http-server 当前目录就会成为根目录）
- index.html 和 ./index.html一样
<a href="/a/b/c.html">"访问c.html“</a> <a href="a/b/c.html">"访问c.html“</a> -
伪协议
<a href="javascript:;"></a>实现点击之后无动作（跳转和刷新） <a href="">刷新</a> <a href="#">跳转到顶部，可在network中查看到新文件</a> <a href="mailto:1111@163.com">发送邮件</a> <a href="tel:1333333333">打电话</a> -
href="xxx"
href="xxx"
2.a-target
取值
- _self (自身标签页打开)
- _blank （空白页打开）
- _parent
- _top
3.a-download
下载
二、table标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=, initial-scale=1.0">
<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>
<tr>
<th>数学
</th>
<td>79</td>
<td>82</td>
<td>92</td>
</tr>
<tr>
<th>英语
</th>
<td>100</td>
<td>97</td>
<td>97</td>
</tr>
</tbody>
<tfoot>
<th>总分
</th>
<td>xxx</td>
<td>xxx</td>
<td>xxx</td>
</tfoot>
</table>
</body>
</html>
三、img标签
-
作用
发出 get 请求，展示图片
-
属性
src/alt/width/height
-
事件
onload/onerror
-
响应式
max-width: 100%
四、配置
yarn global add http-server
http-server . -c-1
.可以省略，-c-1表示不要缓存
不要双击打开html，而是用http-server（像用户一样访问网页）
需要手动+文件名如下图
缩写hs -c-1
yarn global add parcel
pacel a-href
\
