如何在HTML中设置图像的宽度和高度？

在 HTML 中，设置图像的宽度和高度是非常常见的操作，它可以帮助我们更好地控制图像在网页中的布局和显示效果。下面将详细介绍在 HTML 中设置图像宽度和高度的方法。

一、使用 HTML 的 `img` 标签属性设置宽度和高度

HTML 的 `img` 标签用于在网页中插入图像，它有两个常用的属性 `width` 和 `height`，分别用于设置图像的宽度和高度。这两个属性的值可以是像素值（如 `100px`）、百分比值（如 `50%`）或其他合法的长度单位。

以下是一个简单的示例代码：

```html

```

在上述代码中，`src` 属性指定了图像的路径（这里假设 `example.jpg` 是存在的图像文件），`width` 属性设置了图像的宽度为 300 像素，`height` 属性设置了图像的高度为 200 像素。`alt` 属性用于为图像提供替代文本，当图像无法显示时，浏览器会显示该替代文本。

二、使用 CSS 样式设置图像的宽度和高度

除了在 `img` 标签中直接设置宽度和高度属性外，我们还可以使用 CSS 样式来控制图像的大小。CSS 提供了更灵活的方式来设置元素的样式，包括图像的宽度和高度。

以下是一个使用 CSS 样式设置图像宽度和高度的示例代码：

```html

```

在上述代码中，我们在 `head` 标签内使用 `