如何在 HTML 中嵌入图片

在网页开发中，嵌入图片是一个非常常见的任务。HTML 提供了多种方式来在网页中嵌入图片，以下是其中两种常用的方式:

1. 使用 <img> 标签

<img> 标签是在 HTML 中嵌入图片的最常用方式，它的用法如下：

<img src="image.jpg" alt="图片描述">

其中，src 属性指定了图片的 URL，alt 属性指定了图片的文字描述（可选）。

指定图片尺寸

为了更好地控制图片在网页中的显示，可以使用 width 和 height 属性来指定图片的宽度和高度（单位为像素）。例如：

<img src="image.jpg" alt="图片描述" width="300" height="200">

指定图片对齐方式

使用 align 属性可以指定图片在网页中的对齐方式。常用属性值包括：

• left：图片左对齐
• center：图片居中对齐
• right：图片右对齐

<img src="image.jpg" alt="图片描述" align="left">

2. 使用 CSS 背景图像

除了使用 <img> 标签，还可以使用 CSS 的 background-image 属性来嵌入图片。使用该方式的优点是可以将多个图片合并成一个 sprite 图，从而减少 HTTP 请求，提高网页性能。

<div class="sprite"></div>

.sprite {
  background-image: url('sprite.png');
  background-position: 0 -100px;
  width: 100px;
  height: 100px;
}

其中，background-image 属性指定了背景图片的 URL，background-position 属性指定了背景图片在背景中的位置。

以上就是在 HTML 中嵌入图片的常见方式。根据实际需求选择不同的方式即可。