html 代码:

1
2
3

<style type="text/css">
    @import url(print-style.css) print;
</style>

使用link标签要比使用@import规则性能更好。

1 inch = 2.54 cm

1cm = 96/2.54 ≈ 37.80 px

1px = 2.54/96 ≈ 0.0265 cm

100px = 2.65 cm

A4纸的标准尺寸为:

21.0cm * 29.7 cm

在96DPI分辨率下,其对应的像素尺寸大约为:

794px * 1123px

因为不同的DPI下,其对应的像素尺寸是不同的,所以才要使用print css,使用物理单位来描述要打印的页面,这样打印效果就会一致了。

1
2
3
4

@page :pseudo-class {
    size: A4 landscape;
    margin:2cm;
}

其中伪类可以指定:

1
2
3

@media print {
    p {orphans:3; widows:2;}
}

其他
1.对于页面上有显示而不想打印的内容,可以将其display设置为none来避免打印。
2.需要打印的内容尽量避免float,有些浏览器不会正确的打印浮动的内容。
3.可以调用window.print()函数来打印当前页面。
4.分页打印或换页打印：page- break-before和page-break-after CSS属性并不会修改网页在屏幕上的显示，这两个属性是用来控制文件的打印方式。每个打印属性都可以设定4种设定值：auto、always、left和 right。其中Auto是默认值，只有在有需要时，才需设定分页符号 (Page breaks)。page-break-before若设定成always，则是在遇到特定的组件时，打印机会重新开始一个新的打印页。page- break-before若设定成left，则会插入分页符号，直到指定的组件出现在一个左边的空白页上。page-break-before若设定成 right，则会插入分页符号，直到指定的组件出现在一个右边的空白页上。page-break-after属性会将分页符号加在指定组件后，而非之前。在下列程序中您将可以看到这些属性的设定。