在HTML文档中插入图片可以通过使用<img>标签来实现。本文将介绍如何在HTML文档中插入图片，并提供一些示例。
## 基本用法
要在HTML文档中插入图片，请使用<img>标签，并指定图片的URL和alt属性。
```html
<img src="image.jpg" alt="图片描述">
```
- src属性用于指定图片的URL，可以是相对路径或绝对路径。
- alt属性用于提供图片的描述信息，通常在图片无法加载时显示。
## 指定图片大小
可以使用width和height属性来指定图片的大小。
```html
<img src="image.jpg" alt="图片描述" width="500" height="300">
```
- width属性用于指定图片的宽度，单位为像素。
- height属性用于指定图片的高度，单位为像素。
## 响应式图片
为了使图片在不同设备上显示得更好，可以使用响应式图片。响应式图片可以根据设备屏幕大小自动调整大小。
```html
<img src="image.jpg" alt="图片描述" class="responsive-image">
```
```css
.responsive-image {
max-width: 100%;
height: auto;
}
```
- max-width属性用于指定图片的最大宽度为100%，这意味着图片将根据其容器的大小进行调整。
- height属性设置为auto，以确保图片的高度与宽度成比例。
## 图片格式
常见的图片格式有JPEG、PNG和GIF。在选择图片格式时应该考虑以下因素：
- 图像质量：JPEG格式适用于需要高质量图像的场合，而PNG格式适用于需要透明背景或较小文件大小的场合。
- 动画效果：GIF格式适用于需要动画效果的场合。
- 浏览器兼容性：不同浏览器对不同图像格式的支持程度不同，因此应该选择广泛支持的格式。
## 总结
使用<img>标签可以在HTML文档中插入图片。可以使用src、alt、width和height属性来指定图片的URL、描述信息和大小。响应式图片可以根据设备屏幕大小自动调整大小。在选择图片格式时应该考虑图像质量、动画效果和浏览器兼容性。
