CSS页面布局w/Breaks

Question

我正在尝试创建一个基本上看起来像word文档的网页.将有多个框向下滚动,文本将从一个页面流向另一个页面.

有谁知道我甚至会在哪里开始？谢谢.

编辑:它应该在浏览器中,看起来类似于:

(忽略列)

Answer 1

类似的事情听起来可以使用 javascript，但这在一定程度上取决于 html 的结构，以及您是否想要打破段落或只是将下一段移动到下一页（如果它不适合\xc2\xb4t）

\n\n

所以最简单的例子，不破坏具有平面 html 结构的段落/ html 元素（没有嵌套的 div、列等），例如：

\n\n

<div class="document">\n  <h1>title</h1>\n  <p>texts</p>\n  <h2>subtitle</h2>\n  <p>texts</p>\n  ...\n  <p>texts</p>\n</div>\n

\n\n

会做类似的事情：

\n\n

height = 0\nloop through all direct child elements of .document\n{\n    if ( (height + element_height) > page_height)\n    {\n        add page_break_element before current element\n        height = 0\n    }\n    height = height + element_height\n}\n

\n\n

I\xc2\xb4d 使用jquery，因为它可以轻松地循环元素、测量高度等。

\n\n

我想打破段落也是可能的，但需要很多额外的工作。

\n