# HTML 图片的使用

# 图片标签的介绍

1
2
3

<img src = "" alt = "">
<!-- src : 属性名 -->
<!-- alt : 替换文本 -->

特点 :

• 单标签
• img 标签需要展示对应的效果，需要借助标签的属性进行设置

注意点 :

• 标签的属性写在开始标签内部
• 标签上可以同时存在多个属性
• 属性之间以空格隔开
• 标签名与属性之间必须以空格隔开
• 属性之间没有顺序之分

# 图片标签的 src 属性

src 属性值为图片所保存的路径

路径可以为相对于此 HTML 文件的路径，也可以为绝对路径

# 图片标签的 alt 属性

alt 属性值为替换文本

当图片加载失败时，才显示 alt 的文本

当图片加载成功时，不会显示 alt 的文本

# 图片标签的 title 属性

title 属性值为提示文本

当鼠标悬停时，才显示的文本

注意点 :

• title 属性不仅仅可以用于图片标签，还可以用于其他标签

# 图片标签的 width 和 height 属性

width 和 height 属性值为图片的宽度和高度 (数字)

注意点 :

• 如果只设置 width 或 height 中的一个，另一个没设置的会自动等比例缩放 (此时图片不会变形)
• 如果同时设置了 width 和 height 两个，如设置不当此时图片可能会变形