我希望能够水平滚动一些水平对齐的全屏图像。我尝试使用 float、display: inline-block 和其他解决方案,但它们都不适合我。我的图像不是水平对齐而是垂直堆叠
<body>
<div class="wrap">
<div class="img">
<img src="./assets/img1.jpeg" alt="img1">
</div>
<div class="img">
<img src="./assets/img2.jpeg" alt="img2">
</div>
<div class="img">
<img src="./assets/img3.jpeg" alt="img3">
</div>
</div>
</body>
body,
.wrap,
{
margin: 0;
padding: 0;
height: 100%;
width: 100%;
}
.wrap img {
display: inline-block;
height: 100vh;
width: 100vw;
}
最佳答案
尝试将 flex 用于此解决方案:
.wrap {
width: 500%;
display: flex;
flex-wrap: wrap;
}
关于html - 如何水平对齐全屏图像?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54403284/