知识分享
html to pdf & print 技术点整理
  1. 工具介绍


    • wkhtmltopdf参数翻译, html => pdf 最佳工具,网页代码->浏览器渲染->渲染结果(画面)输出为pdf

    • iTextSharp .net pdf文件操作工具,用于合并和添加水印

    • SumatraPDF 绿色阅读器,用于打印及预览

  2. CSS打印相关


    • display:table-header-group, display:table-footer-group 并不需要

    • wkhtmltopdf issue

    •  table > thead:before, tr page-break-inside: avoid;
    • js: window.print()

    • @media print

    • 比较新的css

    • 老站

    • 京东订单打印做法,新开页面,使用兼容性好的css

    • s.AppendLine("附件:平台业务成交单");
    • counter-increment

    • @page变量

    • 分页属性,打印样式

    • 浏览器直接打印兼容性

    • table header/footer

    • 页码处理(需求:含子表,动态页脚页码)


      • 子分页,wk js head导入子表页码, js要点

      • 合并,计算页数,iTextSharp

      • wk js foot导入总页码

      • js/css 参数无效

      • 直接页脚,--footer-right \"[page]/[toPage]\"

    • 本地预览


      • SumatraPDF.exe,-restrict(kiosk-like), settings

    • 其他


      • wkhtmltopdf本地字体, @font-face, src: url("c:/windows/fonts/msyh.ttc"); 并不是所有的字体都支持,比如黑体

      • linux下的安装与中文字体导入

      • 水印,itextsharp

    • 一个严重bug


      • args.Append(string.Format(" --header-html {0}", headerPath));导入的header.html,table元素会压住body区域border-bottom高度像素,有可能导致body区顶部元素被覆盖border-bottom高度

      • 解决方法,第一步先换新版本wkhtmltopdf.exe,至少wkhtmltox-0.12.5-1.msvc2015-win32版本

      • 把header.html里的border-bottom-width设置成零,如果还有覆盖,可以粗暴地border:none,总之通过调整border宽度就可以,注意必须先有第一步

      • margin-top: -2px这种,会产生重影,没法用,其它方式我试了至少20种,不列举,均无效,共勉。。