我的@media 打印无法在 Firefox 中正确显示？答案

【问题标题】：My @media print doesn't display correctly with Firefox?我的@media 打印无法在 Firefox 中正确显示？
【发布时间】：2013-04-23 23:25:09
【问题描述】：

打印在 Chrome 和 Safari 上看起来很棒，但在 Firefox 上很奇怪。我找不到有关如何在 Firefox 上修复 @media 打印的资源？任何意见是极大的赞赏！

编辑：分页符在 Firefox 上对我不起作用。我正在使用 Twitter Bootstrap，在 Firefox 上，文本的对齐方式与例如在 Firefox 上的对齐方式不同。铬合金。

这是我的 CSS：

@media print {
   h1 {
      color: #000;
   }

   .navbar {
      display: none;
   }

   h1, h2, h3 {
  page-break-after: avoid;
   }    


a[href^=http]:after {
       content:" <" attr(href) "> ";
    }

a[href^="#"]:after {
       content: "";
}

   body {
      width: 100%;
      margin: 0;
      padding: 0;
      background: none;
   }

  @page {
     margin: 2cm;
  }

}

【问题讨论】：

怪异是什么意思？究竟出了什么问题？
对不起！我编辑了描述。我认为问题可能与我使用响应式 Bootstrap 主题有关？对我来说，在 Chrome 上，响应能力适用于打印，但不适用于 Firefox。

标签： css firefox twitter-bootstrap printing

【解决方案1】：

Gecko 不支持page-break-after: avoid。这能解释你看到的行为吗？

【讨论】：