Question

HTML和/或CSS中是否有一种方法可以按高度自动将多列内容分成多个页面？例如，如果要在网页中显示电子书并使用多列，您可能希望一次在视口中显示1页= 2列，然后有一个垂直中断来模拟分页符，并具有下两页专栏。

例如，如果我想在一个HTML页面上以两列格式显示整个章节，如果我只是column-count:2，那么每列可能会很长并且您必须滚动一直到底部读取第一列，然后一直回到顶部继续第二列。我正在寻找的是一种避免必须滚动回顶部但仍然使用列的方法。

我意识到这可以通过Javascript完成，但我没有询问使用javascript 。我只对纯HTML / CSS技术感兴趣。如果没有办法，我已经知道如何在JS中做到这一点。

修改以下是我正在寻找的内容的简单说明：http://jsfiddle.net/xGqAC/7/embedded/result/

要说清楚，我没有专门用Javascript实现，我只知道它可以在那里完成，而且我想已经有多列库可以做到这一点，但同样，那不是我的意思我正在寻找。

Answer 1

您无法通过CSS查找内容。

但是你可以设置列的高度和宽度，如果你没有设置任何colum-count，将根据需要添加任意数量的列，这可以让你到达我能想到的最接近的受害者......如果您的浏览器支持列

html, body {
  height:100%;
  margin:0;
  overflow:hidden;
}
body {
  width:940px;
  column-width:450px;
  column-gap:10px;
  column-rule:solid;
  box-shadow:inset 0 0 0 3px;
  overflow:auto;
  margin:auto;
}

CSS中没有像PDF（媒体网/媒体印刷）:) http://codepen.io/anon/pen/hxcIt

垂直分页和列

1 个答案: