效果:

CSS实现平铺滚动效果


主要就是在父容器上设置水平方向滚动,并禁止换行。然后子元素用inline-block实现平铺。关键CSS如下:

<ul>
    <li></li>
    <li></li>
    <li></li>
</ul>

ul {
    width: 100%;
    overflow: scroll;
    white-space: nowrap;
}

li {
    display: inline-block;
    width: 50%;
    vertical-align: top;
}


相关文章: