[分享]css分页打印去掉底部时间

CSS分页打印可以帮助我们控制页面在打印时的分页效果，使打印结果更加符合我们的预期。但是默认情况下，打印页面底部会自动添加打印时间，这可能会影响我们的打印效果。如何去掉这个底部时间呢？下面介绍一个简单...

CSS分页打印可以帮助我们控制页面在打印时的分页效果，使打印结果更加符合我们的预期。但是默认情况下，打印页面底部会自动添加打印时间，这可能会影响我们的打印效果。如何去掉这个底部时间呢？下面介绍一个简单的方法。

@media print {
  @page {
    size: auto;
    margin: 0;
  }
  body {
    margin: 2cm;
  }
  table {
    page-break-after: auto; 
  }
  table:last-of-type {
    page-break-after: never;
  }
  .no-print {
    display:none;
  }
  @bottom-center {
    content: counter(page) " of " counter(pages);
  }
} 

上面的CSS代码是一个典型的CSS分页打印样式表，其中包含了一个计数器的设置，用于在页面底部显示当前打印页数。

如果我们不想显示底部时间，只需将上面的计数器代码注释掉即可：

@media print {
  @page {
    size: auto;
    margin: 0;
  }
  body {
    margin: 2cm;
  }
  table {
    page-break-after: auto; 
  }
  table:last-of-type {
    page-break-after: never;
  }
  .no-print {
    display:none;
  }
  /*@bottom-center {
    content: counter(page) " of " counter(pages);
  }*/
} 

这时候，我们再打印页面，就会发现底部的时间已经不见了。