如何旋转mansonry布局,其中高度是常量和宽度变量?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (64)

互联网上的每个人都谈论高度自由且宽度相同的mansorny。

我需要创建高度恒定且宽度不受限制的mansonry。

我的目标是可以在Microsoft Photos webapp上找到这种布局。

什么是我最好的选择来实现这种布局,我可以用css纯粹做,也许css网格?有没有人创建这样的东西,并有一些示例或教程来看待?

提问于
用户回答回答于
<style>

.container{
    width: 100%;
    height: auto;
    margin: auto;
    padding: 0px;
    position: relative;
    overflow: hidden;
}
.container div{
    height: 100px /*the Height you want*/;
    position: relative;
    float: left /*You can use display:inline-block*/;
    overflow: hidden;
    padding: 0px;
}
.container div img{
    height: 100%;
    position: relative;
}

</style>


<div class="container">
    <div>
        <img src="" alt="">
    </div>
</div>

所属标签

可能回答问题的人

  • 不吃貓的鱼oo

    5 粉丝466 提问6 回答
  • Richel

    8 粉丝0 提问4 回答
  • 发条丶魔灵1

    6 粉丝525 提问3 回答
  • 人生的旅途

    10 粉丝484 提问3 回答

扫码关注云+社区

领取腾讯云代金券

年度创作总结 领取年终奖励