如何在 HTML 页面中使用图片的高度和宽度属性?

htmlweb developmentfront end technology更新于 2024/6/28 22:04:17

图片可以帮助读者更好地理解网页内容，从而使内容更有趣。

我们可以在 HTML 页面中插入图片。要在 HTML 页面中插入图片，请使用 <img> 标签。它是一个空标签，仅包含属性，因为不需要结束标签。

src 属性用于添加图片来源，即图片的 URL(文件位置)。alt 属性用于添加替代文本，width 用于添加宽度，height 用于添加图片的高度。

我们使用 style 属性来更改图像的大小，即图像的高度和宽度。

以下是在 HTML 页面上更改图像高度和宽度的语法。

<img src="url" alt="some_text" width="" height="">

在下面的示例程序中，我们使用 style 属性来更改图像的高度。


<!DOCTYPE html>
<html>
<body>
   <img src="https://www.cainiaomax.com/opencv/images/opencv-mini-logo.jpg" height="300px">
</body>
</html>

在下面的示例程序中，我们使用 style 属性来改变图像的宽度。


<!DOCTYPE html>
<html>
<body>
   <img src=" https://www.cainiaomax.com/opencv/images/opencv-mini-logo.jpg" width="500px">
</body>
</html>

在下面的示例程序中，我们使用 style 属性来改变图像的宽度和高度。


<!DOCTYPE html>
<html>
<body>
   <img src="https://www.cainiaomax.com/opencv/images/opencv-mini-logo.jpg" height="200"width="400px">
</body>
</html>

有用资源