a 标签的用法

属性
- href的取值
  1. 网址：
    
    www.baidu.com
    
    www.baidu.com
    
    //www.baidu.com 推荐使用这一种写法，浏览器会自动补全。
  2. 路径:
    
    绝对路径：/a/b/c, （这里的根目录指的是http服务的根目录）
    
    相对路径：index.html和./index.html
  3. 伪协议:
    
    javascript:代码; （需要写冒号和分号）
    
    应用场景：希望点击a标签之后页面不刷新也不返回到顶部，什么也不做。
```
 < a href="javascript:0;"> 

```
    mailto:邮箱
```
< a href="mailto:123@qq.com">
```
    tel:手机号
```
< a href="tel:123456789">
```
  4. id: href=#id名，可以跳转到id名为Id的标签(锚点链接)
```
    < p id="xxx"></p>
    < a href="#xxx">
```
- target的取值
  1. _blank (浏览器内打开一个新窗口)
  2. _top（在顶级窗口打开）
  3. _parent（在当前链接的上一级）
  4. _self （在本窗口打开）
- download
  
  作用：不是打开页面，而是下载页面
  
  问题：不是所有的浏览器都支持，尤其是手机浏览器可能不支持
作用
- 跳转外部页面
- 跳转内部锚点
- 跳转到邮箱或电话等

img 标签的用法

作用

发出get请求，展示一张图片
属性

src: 图片网络地址或者本地相对绝对地址

alt: 如果图裂了，无法加载，会显示这个alt属性的文字作为备用

width：如果只写宽度，高度会自适应

height：如果只写高度，宽度会自适应

一个合格的前端不能让图变形！所以就只写宽度或者高度！

事件

onload 加载成功

onerror 加载失败（可以在加载失败的时候替换一张图片提升用户体验）

<img id="xxx" src="图片地址" alt="提示" width="800px" />
<script>
  xxx.onload = function () {
    console.log("图片加载成功");
  };
  xxx.onerror = function () {
    console.log("图片加载失败");
    xxx.src="另一张图片地址"
  };
</script>

响应式

max—width:100%

图片可以适应不同设备的屏幕大小

table 标签的用法

相关的标签
- thead (表格的头部)
- tbody (表格的主体)
- tfoot (表格的脚注)
- tr (table row 行)
- td (table data 数据)
- th (table head 表头)
相关的样式
- table-layout 定义布局的表格单元格
  
  参数：auto(自动,根据内容来计算宽度) fixed(定宽,宽度平均)
- border-collapse 为表格设置合并边框
- border-spacing 设置相邻单元格的边框间的距离

总结

要清楚HTML的章节标签、内容标签、重难点标签。其中重难点标签需要重点去记，html5 总共有 110 个标签，忘记是很正常的，更多的是知道怎么去搜索，怎么用，实践出真知。

《HTML常用标签》

a 标签的用法

img 标签的用法

table 标签的用法

总结