网页打印样式适配

使用媒体查询@media print可以指定设置打印的样式。

@media print {
  body {
    line-height: 1.5;
  }
}

使用该属性,我们可以轻松的控制页面的显示样式和打印样式不一样。比如,在打印的时候隐藏区域,可以写一个 css 样式隐藏。

@media print {
  .no-print {
    display: none;
  }
}

只需要将no-print添加到元素的class中,正常显示时不起作用,打印时起到隐藏的效果。

如果您觉得本文对您有用,欢迎捐赠或留言~
微信支付
支付宝

发表评论

您的电子邮箱地址不会被公开。