元素仅在打印页面上可见

coo*_*ool 13 html css printing

我只在打印页面上显示一些元素时遇到问题.例如,我有一个页面,用户可以看到打印预览(简单的JavaScript).在该打印页面上我只显示了页面中的一些元素(并非所有元素),用于:

@media print {
  .noPrint {
      display:none;
  }
}
Run Code Online (Sandbox Code Playgroud)

现在,当我将.noPrint应用于元素时,它将不会在打印页面中显示.但是,如何在页面上创建例如div,这将在"打印页面"上保持不变,但在常规页面上不会.

这足够了,大多数浏览器都支持吗?

@media screen, projection, tv {


 .dontShowThis {
    display:none
  }
}
Run Code Online (Sandbox Code Playgroud)

现在,如果我想在打印页面上显示元素而不是在常规页面上显示,我将执行此操作

<div class="dontShowThis printIt">Some content goes here</div>
Run Code Online (Sandbox Code Playgroud)

TNX

Rad*_*ris 25

我刚才做过类似的事情,这就是我做的事情:

@media screen
{
    .noPrint{}
    .noScreen{display:none;}
}

@media print
{
    .noPrint{display:none;}
    .noScreen{}
}

<div class="noScreen">Some content goes here</div>
Run Code Online (Sandbox Code Playgroud)

所有主流浏览器都支持AFAIK,甚至IE8也开始支持它.