如何让父容器溢出滚动，同时让子 div 横向排列？

学习文章要努力，但是不要急！今天的这篇文章《如何让父容器溢出滚动，同时让子 div 横向排列？》将会介绍到等等知识点，如果你想深入学习文章，可以关注我！我会持续更新相关文章的，希望对大家都能有所帮助！

如何实现[父容器溢出滚动,子div横向排列]?

在html中，可以设置父容器.ctn的overflow-x: scroll属性，启用水平滚动条。同时设置white-space: nowrap，防止子元素换行。

.ctn {
  overflow-x: scroll;
  white-space: nowrap;
  width: 100%;
}

为了让子元素横向排列，需要设置子元素.div1、.div2和.div3的display: inline-block属性。

.div1,
.div2,
.div3 {
  display: inline-block;
}

这样，就可以实现父容器溢出显示滚动条，子元素横向排列的效果。

终于介绍完啦！小伙伴们，这篇关于《如何让父容器溢出滚动，同时让子 div 横向排列？》的介绍应该让你收获多多了吧！欢迎大家收藏或分享给更多需要学习的朋友吧~米云公众号也会发布文章相关知识，快来关注吧！

Vue中如何实现滚动到顶部加载更多数据且保持滚动位置不变？