本文概述
HTML img标签用于在网页上显示图像。 HTML img标签是一个空标签, 仅包含属性, HTML图像元素中不使用结束标签。
让我们看一个HTML图片示例。
<h2>HTML Image Example</h2>
<img src="good_morning.jpg" alt="Good Morning Friends"/>立即测试
输出：
HTML img标签的属性
src和alt是HTML img标签的重要属性。 HTML图像标签的所有属性在下面给出。
1）src
它是描述图像源或路径的必要属性。它指示浏览器在服务器上查找图像的位置。
映像的位置可能在同一目录或另一台服务器上。
2）一切
alt属性为图像定义了替代文本（如果无法显示）。 alt属性的值以文字描述图像。 alt属性被认为对SEO预期有利。
3）宽度
它是一个可选属性, 用于指定显示图像的宽度。现在不建议使用。你应该使用CSS代替width属性。
4）高度
h3图像的高度。 HTML height属性还支持iframe, 图片和对象元素。现在不建议使用。你应该使用CSS代替height属性。
将height和width属性与img标签一起使用
你已经了解了如何在网页中插入图片, 现在, 如果我们要根据需要提供一些高度和宽度来显示图片, 则可以使用图片的height和width属性进行设置。
例
<img src="animal.jpg" height="180" width="300" alt="animal image">立即测试
输出：
注意：始终尝试插入具有高度和宽度的图像, 否则在网页上显示时可能会闪烁。
使用alt属性
我们可以将alt属性与标记一起使用。如果无法在浏览器中显示图像, 它将显示替代文本。以下是alt属性的示例：
<img src="animal.png" height="180" width="300" alt="animal image">输出：
如何从另一个目录/文件夹获取图像？
要在网络中插入图片, 该图片必须位于放置HTML文件的同一文件夹中。但是, 如果在某些情况下其他目录中有可用的映像, 则可以这样访问映像：
<img src="E:/images/animal.png" height="180" width="300" alt="animal image">在上面的语句中, 我们将图像放在本地磁盘E ——> images文件夹——> animal.png中。
注意：如果src URL不正确或拼写错误, 则它将不会在网页上显示你的图片, 因此请尝试输入正确的URL。
使用<img>标签作为链接
我们还可以将图像链接到其他页面, 也可以将图像用作链接。为此, 请将<img>标记放在<a>标记内。
例
<a href="https://www.srcmini02.com/what-is-robotics"><img src="robot.jpg" height="100" width="100"></a>立即测试
输出：
支持的浏览器
| Element | Chrome | IE | Firefox | Opera | Safari |
| <img> | Yes | Yes | Yes | Yes | Yes |
