我非常想创建一个网页，当缩放级别较小时，它具有与 Microsoft Word 或 Acrobat Reader 相同的外观，并且它会显示带有页面边框的并排页面。
我不知道该怎么做是定义一个固定大小的 paperborder 并将内容放入其中（这将是可变数量的 html 块元素），并使这些元素从一个页面“流动”到另一个页面，根据需要创建尽可能多的页面并使用适当的分页符。这是为了模拟打印输出，以便快速设计研究原型。
我的想法告诉我 javascript 是必要的，但由于我对 javascript 的了解接近于零，而且我几乎不想学习 CSS3 布局技巧，所以首选纯 CSS（尽管 JS 解决方案将是一个不错的选择）。
当前单页文档如下：
<!DOCTYPE html>
<html lang="pt-br" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8" />
<title>Relatório Html</title>
<style type="text/css">
html, body {
margin:0;
padding:0;
}
body {
background-color: #aaa;
}
.paperpage {
position: absolute;
width: 600px;
padding: 50px 30px 40px 30px;
margin-left: -320px;
left: 50%;
top:10px;
bottom:10px;
background-color: white;
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
}
#innerpage {
position: relative;
margin: 0 auto;
height: auto !important;
min-height: 100%;
}
</style>
</head>
<body>
<div class="paperpage">
<div id="innerpage">
<p>Some Content</p>
</div>
</div>
</body>
</html>
这在 CSS3 甚至 Javascript 中都不容易做到。执行此操作的 Google Docs 有自己的计算页面引擎。也就是说，CSS3 区域模块发布了一个非常早期的草案，这将使这变得更加简单。
这里的一般理论是每次更新时测量文本的大小，并重新计算所需的页面，适当地填充内容。正如您可以想象的那样，这并不是世界上最容易做的事情。有很多不同的方法来测量内容和类似的事情，如果您真的很专注并深入研究，我建议您查看这里与测量 javascript 中的文本和元素大小相关的许多问题。
我们发现实现这种显示的最佳方法是实际以 PDF 格式显示并使用 PDFObject 显示它，或者更好的是直接在
<object>例如：
<object
data="/clients/<%= client.id %>/reports/print?preview=true"
type="application/pdf" width="100%" height="98%">
<p>Your browser does not support embedded PDFs.</p>
</object>
我们使用 wkhtmltopdf 进行所有 HTML 到 PDF 的转换。它使用起来相对简单，我们已经在极其复杂的 HTML 文档中使用它并使用了各种 CSS 技术，并取得了巨大成功。
根据我的经验，只要您不需要在该视图中实际编辑文档，与编写特定的 CSS 显示方法相比，以这种方式显示它会节省更多时间。
祝你好运！