Question

我有一个动态页面，可以显示数据库中的成员信息及其照片。我的问题是，当用户打印页面时，它有时会切断成员信息并在下一页上打印其余信息。有没有办法强制页面大小或不允许信息分布在两个页面上的东西？也许是Javascript或CSS？

Answer 1

如果您将成员信息和图片封装在div或其他块中，则可以使用类似于下面的page-break-inside CSS属性。

<div class="member-info">
    ....
</div>

.member-info {
    page-break-inside: avoid;
}

Answer 2

您可以使用media queries功能@media print设置要打印的页面。

Answer 3

您可以使用CSS和媒体查询在打印页面时为其设置样式。

它看起来像这样（我不知道你的确切HTML看起来如何）：

@media print {
  body {
    width: 100%;
  }
}

您可以在此处详细了解：

Answer 4

美好而简单！

@media screen {
  body {
    width: 75%;
  }
}

@media print {
  body {
    width: 100%;
  }
}