1、a 标签的用法
href的取值：
网址：
路径：
/a/b/c以及a/b/c
index.html以及./index.html
id地址：#xxx
伪协议：javascript:代码;
mailto:邮箱
tel:手机号
<a href="//baidu.com">百度</a>
<a href="javascript:;">伪协议</a>
<a href="1.txt">查看</a>
<a href="mailto:xxxxxx@126.com">发邮件</a>
<a href="tel:12345678">打电话</a>
<a href="#xxx">跳转id</a>
<a href="/a/b/c">访问文件</a>
target的取值：
内置名字：
_blank 新窗口
_self 当前窗口
_top 最外层窗口
_parent 父级窗口
2、img 标签的用法
作用：
发出get请求，展示一张图片
属性：
src/alt/height/width
事件：
onload/onerror
响应式：
max-width:100%
<head>
<style>
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
img {
max-width: 100%;
}
</style>
</head>
<body>
<img id=xxx src="tu.png" alt="奥特曼打怪兽">
<script>
xxx.onload = function(){
console.log("图片加载成功");
}
xxx.onerror = function(){
console.log("图片加载失败");
xxx.src = '/404.png';
};
</script>
</body>
3、table 标签的用法
相关标签：
table/thead/tbody/tfoot/tr/th/td
相关样式：
table-layout 表格布局
border-collapse 合并表格
border-spacing 表格间隙
<head>
<style>
table{
width: 400px;
table-layout: auto;
border-collapse: collapse;
border-spacing: 0;
}
th,td{
border: 1px solid red;
}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th></th>
<th>甲</th>
<th>乙</th>
<th>丙</th>
</tr>
</thead>
<tbody>
<tr>
<th>语文</th>
<td>70</td>
<td>80</td>
<td>90</td>
</tr>
<tr>
<th>数学</th>
<td>90</td>
<td>80</td>
<td>70</td>
</tr>
<tr>
<th>英语</th>
<td>40</td>
<td>40</td>
<td>40</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>总分</th>
<td>200</td>
<td>200</td>
<td>200</td>
</tr>
</tfoot>
</table>
</body>
预览图：
4、form标签：
作用：
发get或post请求，然后刷新页面
属性：
action/autocomplete/method/target
事件：
onsubmit
注意事项：
- form里面的input要有name
- form里面放一个type="submit"才能触发submit事件
<form action="/xxx" method="post" autocomplete="on" target="_blank">
<input name="username" type="text">
<input type="submit">
</form>
5、input标签：
作用：
让用户输入内容
属性：
text/button/submit/checkbox/email/file/hidden/number/password/radio/search/tel
name/autofocus/checked/disabled/maxlength/pattern/value/placeholder
事件：
onchange/onfocus/onblur
验证器：
HTML5新增功能
注意事项：
一般不监听input里面的click事件
6、其他感想
开始学时若要记住110个这么多html标签，难度很大且没必要，前期掌握几个常用标签的常用属性，知道在哪里可以查询到具体用法，之后就是在实践中学习巩固。
