<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>图片标签</title>
</head>
<body>
<!--
一、图片标签：可以向网页引入一张图片
1.img标签引入图片
2.img是一个自结束标签（单标签）
二、标签的属性
1.src:制定需要插入图片的路径（本地路径、网络路径）
2.alt:替换文本，当图片无法正常显示时，替换的文本(有助于搜索引擎对图片的识别)
3.title：提示文本，当鼠标停在图片上时显示的文本
4.width、height：设置图片的宽度和高度的,单位是像素
二者设置其中任何一个，另外一个会等比例缩小
通常我们不去设置图片宽度和高度，因为大图缩小浪费空间，小图放大清晰度低
三、图片的格式
1.jpg（jpeg）：支持的颜色丰富，不支持透明效果，不支持动图
2.jif：支持颜色较少，支持简单透明、支持动图
3.png：支持的颜色比较丰富，支持复杂透明、不支持动图
4.webp：谷歌新推出的一种图片格式，专门用于网页，具有以上图片所有的优点，但是兼容性不好！
-->
<img src="photo/1.jpg"alt="帅的"title="特别帅的"width="100px">
<img src="https://img1.baidu.com/it/u=1645081738,1997678197&fm=253&fmt=auto&app=138&f=PNG?w=500&h=281"
<img src="photo/1244.jpg"alt="法外狂徒张三">
<img src=""
</body>
</html>
版权属于：
yu
作品采用：
《
署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)
》许可协议授权
评论 (0)