如何垂直堆叠图像

Question

我试了很多次，它们总是有一条水平线来分隔它们，我无法通过（比如在 google 搜索中）

我的css

#gallery{
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-around;
    align-content: space-around;
    flex-wrap: nowrap;

}
#gallery img{
  max-width: 100%;
  align-self: flex-end;
  padding: 5px;
  box-sizing: border-box;
}

我尝试将 flex grow 和 shrink 添加为 1，一旦我将 flex wrap 更改为 nowrap，它们就会膨胀到全尺寸

我想最终用这个方法来显示这里的索引图片 http://setch.me/

Answer 1

实现图像堆叠的唯一方法是使用 Javascript。

有两个 Javascript 库可以为您施展魔法。

• Masonry
• Isotope