假设我在容器中有三个块元素.黑线表示容器.蓝色框是其中的三个块元素.
这三个元素不太合适.如果我设置溢出：隐藏在外部元素上,我会看到前两个元素,部分是第三个元素.
我想要的是,只显示完全适合容器的元素.
这可能与CSS有关吗？
解决方法
是的,可以使用FlexBox,你需要设置flex-direction：column,flex-wrap：wrap和overflow：hidden.
你还需要在flex-childs上设置全宽或计算(100％ – 余量),这样当最后一个元素包装自身时,它将超出父元素并溢出：隐藏在父元素上将负责休息.
@H_403_18@* { Box-sizing: border-Box; } .container { height: 200px; width: 200px; border: 1px solid black; display: flex; flex-direction: column; flex-wrap: wrap; overflow: hidden; } .Box { flex: 0 0 70px; width: calc(100% - 10px); margin: 5px; background: #46A1FF; } @H_403_18@<div class="container"> <div class="Box"></div> <div class="Box"></div> <div class="Box"></div> </div>