相关疑难解决方法(0)

为什么在Flexbox中没有对象适合工作?

我有几个列,我使用flex给出相等的宽度.每个都包含img标签,我希望这些图像能够展示object-fit: cover尺寸.

.container {
  display: flex;
  flex-direction: row;
  width: 100%;
}
.test {
  flex: 1;
  margin-right: 1rem;
  overflow: hidden;
  height: 400px;
}
img {
  object-fit: cover;
}
Run Code Online (Sandbox Code Playgroud)
<div class="container">
  <div class="test"><img src="http://placehold.it/1920x1080"></div>
  <div class="test"><img src="http://placehold.it/1920x1080"></div>
  <div class="test"><img src="http://placehold.it/1920x1080"></div>
  <div class="test"><img src="http://placehold.it/1920x1080"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

图像没有调整大小,如本演示中所示.这是为什么?

html css flexbox

19
推荐指数
2
解决办法
1万
查看次数

标签 统计

css ×1

flexbox ×1

html ×1