常见HTML标签iframe标签现代前端开发很少用到。作用：在页面中嵌入一个页面。默认高度50，宽度100。所以也

`iframe`标签

现代前端开发很少用到。
作用：在页面中嵌入一个页面。

<iframe src="https://www.baidu.com" frameborder="0"></iframe>

默认高度50，宽度100。所以也是一个可替换标签；宽高可以由自己决定，可以在iframe标签中添加width和hight属性改变尺寸，也可用CSS更改。
默认属性 frameborder="0" ，不显示默认边框。
与a标签结合使用

iframe与a标签搭配使用.png

<iframe src="#" name="xxx" frameborder="0" width="100%" height="500px"></iframe>
<a href="https://www.baidu.com" target="xxx">百度</a>
<a href="https://www.qq.com" target="xxx">腾讯</a>

a标签中的 target 属性值要与iframe标签的 name 属性值一致

`a`标签

属性 target

_blank ：新标签页中打开
_self ：a标签当前所在页面打开
_parent：当前链接的上一级页面
_top：顶级窗口

download

需要让用户下载图片或者文件，可以加上一个download属性，但不是所有浏览器都支持，尤其是手机浏览器。

例如：

<a href="https://i.loli.net/2021/06/13/OFfpMbmnHWUYN5d.gif" download>
下载图片
</a>

还可以指定下载文件的名字，例如：

<a href="https://i.loli.net/2021/06/13/OFfpMbmnHWUYN5d.gif" download="嗨，大笨蛋">
下载图片
</a>

补充：

让浏览器下载文件由两个层面决定

由HTTP响应决定：HTTP响应的Content-Type为Content-Type: application/octet-stream浏览器则会以下载的形式来接收这个请求，而不是在页面上展示。

在 a标签中添加download属性：虽然响应的Content-Type不是application/octet-stream，但是依旧可以让浏览器强制下载。

herf

网址
- google.com
- google.com
- //google.com [无协议网址]浏览器自动选择协议
路径
- 相对路径
- 绝对路径
伪协议
- javascript:代码;
- mailto:邮件
- tel:电话
ID
- 内部锚点herf = "#xxx"

`img`标签

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

常用属性：

alt：当图片无法显示时，可以显示的图片说明
src
height：宽高只写其中一项，另一项会根据宽高比自适应
width：不建议两项都写，图片会变形

JS事件

onload onerror监听图片是否加载成功

例如：

html

<img id="xxx" src="dog.png" alt="dog">

JavaScript

xxx.onload = function () {
    console.log("加载成功")
}
xxx.onerror = function () {
    console.log("加载失败")
}

响应式

max-width:100%

常见HTML标签

iframe标签

a标签

img标签

table标签

`iframe`标签

`a`标签

`img`标签

`table`标签