HTML CSS 如何显示具有相同宽度和不同高度的元素

Question

<分区>

Answer 1

CSS 有一个名为 columns 的属性，它为您提供了在列布局中显示元素内容的功能，您可以使用它来实现您所描述的。

<div>
    <img src="http://via.placeholder.com/100x60">
    <img src="http://via.placeholder.com/100x80">
    <img src="http://via.placeholder.com/100x100">
    <img src="http://via.placeholder.com/100x120">
    <img src="http://via.placeholder.com/100x140">
    <img src="http://via.placeholder.com/100x160">
    <img src="http://via.placeholder.com/100x180">
    <img src="http://via.placeholder.com/100x200">
</div>

CSS:

div {
   columns: 100px auto;
}

fiddle :https://jsfiddle.net/x6bdft9u/

https://developer.mozilla.org/en-US/docs/Web/CSS/columns

我回答的时候重复了，不好意思