javascript - 用另一个 div 的溢出内容填充 div

Question

我正在尝试构建一个书本风格的网站，其中的内容在两个页面上流动，但我如何构建它才能使来自一个 div 的文本在溢出时转到下一个 div，而不仅仅是向下滚动？

我最后还需要用 wordpress 来实现它，所以我需要编写一些代码来为我做这件事。我需要让它像这样工作:

有什么想法吗？

Answer 1

你可以使用CSS3的多列

对于 2 列，在 div 类/id 上使用此代码

#yourDiv{
    -webkit-column-count:2; /* Chrome, Safari, Opera */
    -moz-column-count:2; /* Firefox */
    column-count:2;
}

如果您希望文本像书中常见的那样对齐，请添加 text-align:justify; 到 上面的代码。

如果你想要列之间的间距使用column-gap:40px;

对于 Firefox 添加 -moz-column-gap:40px;

对于 Safari 和 Chrome 添加 -webkit-column-gap:40px;

根据您的需要更改像素。