在工作中遇到这样一个需求，客户要求： 1、实现在浏览器中打印和导出到word中，要求浏览器打印出来的效果和word中打印的效果基本一致。2、打印的内容要自动分页，第一页的顶部有文件头，最后一页的底部有页尾。

这里记录一下实现的步骤：
首先明确几件事：

电脑屏幕一英寸面积内有72个点
1英寸＝2.54厘米 = 72个点(point、磅) 即：1in= 2.54cm= 72pt
在Windows系统的默认采用的是分辨率是96，也就是一英寸96个像素点，这样磅和像素的换算关系是1pt = 96/72 px。
A4纸规格尺寸为210mm×297mm
word中的 1倍行距，指的是1倍于行网格的大小；CSS中的line-height是当前字体大小为基准来计算。

通过以上计算后可得A4纸96dpi下的分辨率约为794px×1123px，这是我们在制作网页的时候需要的像素。
需求中Word文档取边距为上下2.54cm，左右2.54cm，去掉边距在网页中要打印的内容应为 601px* 930px。
更简单的方法，使用类似photoshop的工具新建文件，直接能够得出以上答案。

由于网页本身支持pt做单位，之后会用pt为单位实现这个需求，下图为去掉页边距后网页的尺寸

字体单位大小对照换算表

前端实现

使用插件html-docx-js和file-saver实现导出word功能
使用媒体查询针对打印样式设置，并针对差异设置打印的样式覆盖掉之前的默认样式。
css中设置纸张、方向、页边距
```
@media print {
	@page {
	       size: A4 portrait; 
	       margin: 2.54cm 2.54cm;
	   }
}
```