html5中怎么设置一张图片横向铺满高度不铺满
时间: 2024-05-11 11:20:24 浏览: 10
可以通过 CSS 的 `object-fit` 属性来实现这个效果。具体操作如下:
1. 在 HTML 中添加图片元素,例如:
```
<img src="your-image-url.jpg" alt="Your Image">
```
2. 使用 CSS 设置图片的样式,通过 `object-fit` 属性来设置图片如何适应其父元素:
```
img {
width: 100%;
height: 100vh;
object-fit: none;
}
```
其中,`width: 100%;` 和 `height: 100vh;` 分别设置图片的宽度和高度,让其铺满整个屏幕高度;`object-fit: none;` 则设置图片不进行缩放,保持原始大小。这样就可以让图片横向铺满高度不铺满了。