什么是最有用的媒体=“打印"?具体的，跨浏览器兼容的 css 属性? [英] What are most useful media="print" specific, cross browser compatible css properties?

问题描述

什么是最有用的 media="print" 特定的、跨浏览器兼容的 CSS 属性?

What are the most useful media="print"-specific, cross-browser-compatible CSS properties?

我认为我们有这 5 个特定于打印的属性.

I think we have these 5 properties for print specific.

1. 分页前
2. 分页后
3. 分页内
4. 寡妇
5. 孤儿

请解释何时何地使用这些?哪些是跨浏览器兼容的?除了 display:none 之外，还有哪些常见的 CSS 属性可以用于打印?

Please explain when and where to use these? Which are cross browser compatible? and what are other common CSS properties can be useful in print, other than display:none?

推荐答案

我使用著名的 A list 分开文章 (CSS 设计:印刷) 和这篇文章制作页面的可打印版本.有一些常见的标签，但很大程度上取决于您使用的 css 模型(以及容器填充和边距):

I use the famous A list apart article (CSS Design: Going to Print) and this article when I need to make a printable version of a page. There are some common tags, but a lot depends on the css model (as well as container padding and margins) you are using:

body {
   background: white;
   font-size: 12pt;
   }
#menu {
   display: none;
   }
#wrapper, #content {
   width: auto;
   margin: 0 5%;
   padding: 0;
   border: 0;
   float: none !important;
   color: black;
   background: transparent none;
   }
div#content {
   margin-left: 10%;
   padding-top: 1em;
   border-top: 1px solid #930;
   }
div#mast {
   margin-bottom: -8px;
   }
div#mast img {
   vertical-align: bottom;
   }
a:link, a:visited {
   color: #520;
   background: transparent;
   font-weight: bold;
   text-decoration: underline;
   }
#content a:link:after, #content a:visited:after {
   content: " (" attr(href) ") ";
   font-size: 90%;
   }
#content a[href^="/"]:after {
   content: " (http://www.alistapart.com" attr(href) ") ";
   }

这篇关于什么是最有用的媒体=“打印"?具体的，跨浏览器兼容的 css 属性?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！