元素仅在打印页面上可见 [英] Element visible only on print page

问题描述

我只在打印页面上显示一些元素时遇到问题。
例如我有一个页面，用户可以看到打印预览（简单的JavaScript）。
在该打印页面上，我只显示了页面中的一些元素（并非全部），使用它：

  @media print {
 .noPrint {
 display：none; 
 
 
 $ / code> 

现在，当我将.noPrint应用于元素时，它将不会在打印页面中显示。
但是，如何在页面上创建例如div，这将在打印页面上是易于理解的，而不是在常规页面上。





这足够了，并得到大多数浏览器的支持吗？

pre code屏幕，投影，电视{


.dontShowThis {
display：none
}
}


现在，如果我想在打印页面上显示元素，但不是在常规页面上，我会这样做

 < div class =dontShowThis printIt>有些内容转到此处< / div> 
  

Tnx

解决方案

  @media screen 
 {
 .noPrint {} 
 .noScreen {display：none;} 
} 
 
 @media print 
 {
 .noPrint { display：none;} 
 .noScreen {} 
} 
 
< div class =noScreen>有些内容会出现在这里< / div> 
  

AFAIK支持所有主流浏览器，即使IE8也开始支持它。

Im having problems with displaying ONLY some elements ONLY on print page. For example i have a page, where users can see print preview (simple javascript). On that print page im showing just some elements from page (not all of them), using for that:

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

Now when i apply .noPrint to an element, it will not be showned in print page. But, how it is possible to create for example div on a page, that will be vissible on "print page" but not on regular page.

Is this enough, and supported by most browsers?

@media screen, projection, tv {


 .dontShowThis {
    display:none
  }
}

And now if i want to show element on print page but not on regular page i will do this

<div class="dontShowThis printIt">Some content goes here</div>

Tnx

解决方案

I did somthing similar a while ago, this is how I did it:

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

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

<div class="noScreen">Some content goes here</div>

AFAIK this is supported by all major browsers, even IE8 started to support it.

这篇关于元素仅在打印页面上可见的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！