re:从0开始的HTML学习之路 7. 图片标签

1. 图片标签

可以向网页中引入一张图片

1. img标签引入图片
2. img是一个自结束标签

2. 标签的属性

1. src：指定需要插入图片的路径（本地路径，网络路径）
2. alt：替换文本，图片无法正常显示时，替换的文本（有助于搜索引擎对图片的识别）
3. title：提示文本，鼠标停放在图片上时，提示的文本
4. width、height：设置图片的宽度和高度，单位是像素
   二者设置其中任意一个，另一个会等比例缩小
   通常不设置图片的宽和高，因为大图缩小浪费空间，小图放大清晰度降低

<img src="dream.gif" alt="应是天仙狂醉">

如果没有这张图的话，就会显示alt中的内容

<img src="dream1.gif" alt="应是天仙狂醉">

3. 图片的格式

1. jpg（jpeg）：支持颜色丰富，不支持透明效果，不支持动图
2. gif：支持颜色少，支持简单的透明效果，支持动图
3. png：支持颜色丰富，支持复杂透明，不支持动图
4. webp：谷歌新推出的图片格式，专门用于网页，具有以上所有的优点，但兼容性不好