1

我有一个 HTML 片段，一个长有序列表的列表项

<li>
    <p class="nw">Abɩlɩsa ba tɔwɛ asɩn mʋ.</p>
    <p class="English">The elders discussed the matter.</p>
</li>

打印文档时，CSS 规则如何将列表项中的两个段落保持在一起？这意味着它们要么一起出现在页面的末尾，要么一起移动到下一页。

如何将段落<p class="nw">和段落保持<p class="English">在一起，以免出现分页符？

我用

 .nw {page-break-after:avoid;}

但不起作用。实际上在nw和英文段落之间有分页符。据我了解规则不应该是这种情况。为了检查它，我使用了 Firefox 的打印预览功能。

4

3 回答 3

3

答案如何在标题后立即避免分页有助于找到解决方案。它指的是 Mozilla 错误数据库中的这个错误。

解决方案如下。

li {
      page-break-inside: avoid;
   }

它在 Firefox 中运行良好。

于 2013-08-08T11:29:11.360 回答
1

你的意思是p班之间没有休息？您可以尝试将所有内容分组到一个<p>元素中，然后用一个<span>元素标识每个类。例如，

<li>
    <p>
       <span class="nw">Abɩlɩsa ba tɔwɛ asɩn mʋ.</span>
       <span class="English">The elders discussed the matter.</span>
    </p>
</li>

或者，如果您只想删除两个<p>元素之间的空格，您可以查看此处 -删除段落之间的空格

这是你的意思吗？

根据您的编辑，您的意思是在印刷方面。这会删除 Web 文档中的段落空间，但不会在打印时删除 - 只是给将来搜索此问题的任何人的注释。R Lacorne 似乎知道已编辑问题的答案。

于 2013-08-07T18:10:08.237 回答
1

有多种因素在起作用，首先是重要性：用户的打印机。

没有万无一失的方法可以实现您想要的（请注意，如果打印机决定这样做，它甚至会将图像一分为二）。

您可以使用一个查询来指示如果它在打印中，则该特定文本会移动到您页面上的某个安全位置，但这可能会导致其他问题，例如破坏布局的正常流程等。

我建议您阅读以下内容： http: //davidwalsh.name/css-page-breaks

和这个 ：

http://www.w3schools.com/cssref/pr_print_pageba.asp

于 2013-08-07T18:26:20.197 回答