前端css 打印

打印元素的页面布局有几个原则

打印元素不能脱离文档流
打印元素内直接嵌套内容，避免出现三层嵌套

// 打印相关
@page {
  size: auto;
  margin: 10mm 0;
}
@media print {
  .printDom{
    margin: 0;
    display: block;
    width: 100%;
    height: auto;
    overflow: hidden;
    h3 {
      margin: 0;
    }
  }
  tr {
    page-break-inside: avoid;
  }
  .text {
    page-break-inside: avoid;
  }
  .box div {
    page-break-inside: avoid;
    // page-break-before: avoid;
    // page-break-after: avoid;
    // page-break-before: always;
  }
}