img 横向拉伸占满

您可以使用CSS的object-fit属性来控制图片的大小和位置。例如，将object-fit设置为cover可以让图片横向拉伸并占满整个容器：

img {
  width: 100%;
  height: 200px; /* 设置图片的高度 */
  object-fit: cover;
}

这将使图片的宽度自适应其容器的宽度，并且图片将被横向拉伸以填满整个容器。请注意，这可能会导致图片的某些部分被裁剪。如果您不希望图片被裁剪，可以使用object-fit: contain，但这可能会导致图片留有空白区域。

相关问题

img 标签拉伸填满

当使用img标签插入图片时，可以通过CSS样式来实现图片的拉伸填满效果。具体的实现方式如下：

1. 设置img标签的宽度和高度为100%：

   <img src="图片路径" style="width: 100%; height: 100%;">

2. 使用CSS样式设置img标签的object-fit属性为cover：

   <img src="图片路径" style="object-fit: cover;">

这样设置后，图片将会按比例拉伸以填满img标签所在的容器，并且超出容器的部分会被裁剪掉。

怎么让盒子中的img横向铺满div

可以通过CSS的属性设置来实现让盒子中的img横向铺满div的效果，具体的做法如下：

1. 设置盒子的样式为display: flex，这样盒子内的元素就会水平排列。

2. 设置img元素的样式为width: 100%；height: auto；这样图片就会自适应div的宽度，并保持高度不变。

3. 如果希望让图片横向平铺，可以设置img元素的样式为object-fit: cover；这样图片会按比例缩放，铺满整个盒子。

示例代码如下：

<div style="display: flex;">
  <img src="your-image.jpg" style="width: 100%; height: auto; object-fit: cover;">
</div>

这样就可以实现让盒子中的img横向铺满div的效果了。