Question

任何人都知道如何在页面上隐藏文字，日期或其他内容，但是当我点击按钮window.print()在那里显示它时？我正在使用：

@media print {
  @page { margin: 0; }
  body { margin: 1.6cm; }
}

@media print {
  .hide-from-printer{  display:none; }
}

<a href="#" onClick="window.print()" class="btn btn-success hide-from-printer">Print</a>

就像这个按钮class="hide-from-printer"一样，它显示在页面上，但隐藏在打印页面之外。我想反之亦然（相反）。有什么建议吗？

Answer 1

使用这种方式：

.hide-from-page { display:none; } /* hide at normal page view */

@media print {
  .hide-from-page { display:inline; } /* make it visible during print */
}

注意：很明显，要将类重命名为正确（而不是hide-from-printer，它必须类似于hide-from-page或show-only-at-print）

Answer 2

你可以使用“屏幕”进行常规屏幕，所以你需要做的就是

@media screen {
    .hide-from-screen {
        display: none;
    }
}

@media print {
     .hide-from-printer {
          display: none;
      }
 }

并相应地使用这些类。

隐藏页面上的文字，但在window.print

2 个答案: