Javascript 打印预览的第一页后，模式内容被切断

我在打印模块内容时遇到了一个问题，这在所有浏览器上都会发生。当我打印模式内容时，它只预览第一页，第一页之后的任何内容都会被切断。我曾尝试在Chrome打印模拟器中调试，但仍然无法找到解决方案

在某个时候，我在打印模拟器中添加了一个滚动条，我可以向下滚动查看所有内容，但是当我打印预览时，它会显示滚动条，并且在第一页之后仍然会切断任何内容。我不知道为什么打印预览与仿真器的行为如此不同

该项目是在反应，普通模式，不使用任何第三方库，如引导模式

用于打印的媒体查询：

@media print {
  body, html {
    height: 100%;
    overflow: visible !important;
  }

  .account-header {
    display: none;
  }

  .list-wrap {
    height: 100%;
    // overflow: scroll !important;
  }
  .account-content {
    margin: 0;
    padding: 0;
    border: 2px solid red;
    position: absolute !important;
    overflow: visible !important;
    visibility: visible !important;
    display:block;
  }

  .account {
    background-color: none !important;
    display: inline-block;
    font-size: 12px;
    border: 1px solid blue;
  }
}

---

注意：。列表换行是应用于.account内容的父容器的类。使用overflow:scroll样式将向打印模拟器添加一个滚动条，我将能够看到那里的所有模式内容。但是在实际的打印预览中，它仍然只显示第一页。

打印时的问题是必须设置页面大小属性。为您提供所描述问题的规则是与

高度相关的规则

根据打印页面的方式和处理分页符的方式，您必须按照以下文档中的说明进行操作：


您应该检查的部分至少包括：





另一篇可以帮助您的文章是：


如果您希望确保与浏览器具有尽可能广泛的兼容性，此GitHub存储库可能会帮助您：

这里没有任何帮助（我没有尝试纸质css）。我设置了分页符，我设置了页面的大小。我已经设置了可见性！重要的。我所做的每件事都只打印符合定义的页面大小的模式的顶部部分，并精确地重复完整内容所代表的页面数量。问题是情态动词。它们对打印机不友好，产品所有者坚持使用它们并打印它们。我将要做的是设置一整套CSS文件，以一种令PO满意的方式设计模式的HTML。如果您可以提供任何演示链接，例如：codepen链接，这将非常有用