Firefox打印时表格边框不显示、Chrome显示正常的兼容性问题求解

这是Firefox在打印场景下对border-collapse: collapse属性的渲染兼容性问题，默认会部分忽略折叠后的表格边框，可按以下方案修复：

• 方案1：替换边框折叠实现方式
  不用border-collapse: collapse，改用border-spacing: 0实现同样的边框无缝效果，只给table和td/th设置边框即可，示例CSS如下：

  table {
    border-spacing: 0;
  }
  table, td {
    border: 1px solid #000;
  }
  

• 方案2：添加打印强制渲染规则
  新增打印媒体查询样式，强制浏览器渲染边框，避免打印设置里的背景渲染开关影响边框显示：

  @media print {
    table, td, th {
      print-color-adjust: exact;
      -webkit-print-color-adjust: exact;
    }
  }
  

• 额外注意：不要给tr元素设置边框，Firefox打印时对tr元素的边框识别度极低，所有边框样式都下沉到td/th、table元素设置即可。

内容的提问来源于stack exchange，提问作者Abraham