html – 如何用CSS拆分网页?

前端之家收集整理的这篇文章主要介绍了html – 如何用CSS拆分网页?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
是否可以使用CSS进行分割屏幕(水平),以便用户可以浏览屏幕上方切片上的部分网站并浏览屏幕下方的另一部分?

解决方法

您需要声明主div的高度值.

对于这个例子.我使用50vh声明它是屏幕的一半.

添加overflow: auto将允许您拥有滚动条.
否则,如果您没有设置溢出并且#top内容无法被可用空间容纳,则它将溢出到底部.

body {
  margin: 0;
  padding: 0
}

#top,#bottom {
  width: 100%;
  height: 50vh;
  overflow: auto;
}
<div id="top">
  Lorem ipsum dolor sit amet,consectetur adipisicing elit. Velit qui corporis,repellat praesentium quas voluptatum soluta rerum incidunt repellendus eos ipsam numquam nostrum magni repudiandae dolorem,a similique,voluptatibus facilis.
  Lorem ipsum dolor sit amet,voluptatibus facilis.Lorem ipsum dolor sit amet,voluptatibus facilis.
</div>


<div id="bottom">
    Lorem ipsum dolor sit amet,voluptatibus facilis.
</div>
原文链接:https://www.f2er.com/html/223777.html

猜你在找的HTML相关文章