img 标签，首先明确img是单标签不是成对出现的即 <img> 即可。
src 属性 就是图片的地址
<!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>img标签</title>
</head>
<body>
<img src="./data/12.png" >
</body>
</html>下图是我文件的相对位置
显示效果
alt 属性 文本代替内容， 当图片无法加载时显示
代码修改如下，请注意我把图片名称修改了，以确保图片加载失败。
<img src="./data/a12.png" alt="图片加载失败是我出现">显示效果：
title 标题属性 鼠标停留是显示的提示问题内容
代码修改后如如下：
<img src="./data/12.png" alt="图片加载失败是我出现" title="鼠标悬停是我出现">显示效果如下图：
width和height 属性 宽高属性，这是这次学习的重点，记住一句话，如果只设置宽和高其中一个属性，则另一个属性按比例变化，也就是为了使图片不变形可以只设置一个参数。
代码修改如下：设置了width = 150
<img src="./data/12.png" alt="图片加载失败是我出现" title="鼠标悬停是我出现" width="150">显示效果：图片的高度也发生了变化，而且图片比例没有发生变化。
944
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
