如何使HTML元素仅在页面打印时显示？

Question

我有这样的HTML元素：

<img src="@Url.Content("~/Content/images/logo.png")" style="width:150px;height:80px;" alt="" /> 

如何使上述元素在打印页面时只显示，而在网络必须墙根。

任何想法我怎么能实现它？

Answer 1

待办事项不需要创建自己的CSS时引导提供的工具...

下列开机synthax：

<img class="visible-print-block" src="@Url.Content("~/Content/images/logo.png")" style="width:150px;height:80px;" alt="" /> 

下面是一些具体的打印状态类：

.visible-print-block 
.visible-print-inline 
.visible-print-inline-block 

这里是文档：http://getbootstrap.com/css/#responsive-utilities-print

Answer 2

做这样的事情：

当网络模式 - 它会被隐藏：

#printOnly { 
    display : none; 
} 

在打印模式 - 它会显示：

@media print { 
    #printOnly { 
    display : block; 
} 
} 

将您的图像div id=printOnly

Answer 3

也许像

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

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