a标签的用法

1. a标签的作用

可以跳转到外部页面
可以定位跳转至内部锚点
跳转到邮箱或电话

2. a标签的属性

href 超级引用超链接到某个网页后跟网址
target 定义新连接的那个网页的打开方式
download 下载该网页（很多浏览器不支持这个属性可以用作了解）
rel=noopener 用于防止bug

3. a标签的href取值

（1）网址：

google.com
google.com
//google.com（建议使用这种书写方式不容易出错）（2）路径
/a/b/c
a/b/c
index.html
./index.html

（3）伪协议

javascript:代码;（"javascript: ;"可以生成一个什么都不做的a标签）
mailto：邮箱
tel：手机号

（4）id

href="#xxx"可跳转到id为xxx的标签实现定位

4. a标签中target的取值（定义了要链接到的新网页的打开方式）

_blank 写作 target="_blank" 新开窗口打开页面
_self 写作 target="_self" 在本身窗口打开页面(默认打开方式)
_top 写作 target="_top" 在顶部窗口打开页面
_parent 写作 target="_parent" 在当前连接所在的上一层打开页面

img标签的用法

1. img标签的作用

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

2. 属性

alt 当图片加载失败时显示的文字内容
src 图片地址
height设定图片的高度
width 设定图片的宽度注意：1. height和width如果同时设置数值会导致图片变形。所以一般只设置其中的一个值，只设定一个值时另一个值会根据图片自适应
在img中height和width设置数值时不加单位

3. 事件

onload 图片加载成功时响应
onerror 图片加载失败时响应

xxx.onload = function(){
    console.log('图片加载成功')
    }
    
    xxx.onerror = function(){
        console.log('图片加载失败');
        xxx.scr="另一张图片地址 该图片用来提示图片加载失败";
    }
    </script>

4. 响应式

style: max-width=100%

作用：该语句可以实现图片铺满屏幕可以很好适应不同浏览器或者不同尺寸大小的手机屏幕

table标签的用法

1. 作用：table标签用来生成表格

<table></table>标签中包含thead,tbody,tfoot三个标签

<thead></thead>表头 里面输入表头部分的内容

<tbody></tbody> 表格内容 里面输入表格中的内容

<tfoot></tfoot> 表尾 里面输入表尾中的内容 有的表格没有表尾

在thead tbody tfoot这三个标签中又会包含以下几个标签：

tr 一行表格中的一行 tr中会包裹着th td

th 表头（用于thead标签）

td 表格数据（用于tbody/tfoot标签）

table thead tbody tfoot tr th td 都是双标签

2. table相关的样式

- table-layout :auto; 自动设定表格宽度
- border-collapse: collapse; 合并边框
- border-spacing Xpx; 设置单元格间空隙大小

border-collapse: collapse;

border-spacing 0px;

这两行代码代表合并表格边框且单元格间隙为零

HTML 常用标签