css 中table占一张A4纸

CSS中，常常需要将表格控制在一张A4纸内显示，这样可以保证表格显示的美观性和可读性。下面介绍几种实现方法。

第一种是通过CSS的page属性来限制表格大小。通过设置page属性，将页面大小设置为A4纸大小，然后设置表格的大小和位置，可以实现表格在一页内显示。

@media print {
  @page {
    size: A4;
  }
  table {
    width: 100%;
    table-layout: fixed; /*强制表格不自动撑开*/
  }
}

第二种是通过CSS3的page-break属性，将表格隔成多页显示。这种方法可以更加精细地控制表格在多页之间的划分。

@media print {
  tr {
    page-break-inside: avoid; /*避免行跨页*/
  }
}

第三种是通过设置表格样式来调整表格大小和位置，使其刚好填满一页。这种方法需要通过不断的试验来调整表格样式，适合在表格内容相对稳定的情况下使用。

@media print {
  table {
    width: 100%;
    table-layout: fixed; /*强制表格不自动撑开*/
  }
  td {
    border: 1px solid black; /*设置边框*/
    padding: 5px; /*设置内边距*/
  }
}

在以上三种方法中，第一种方法较为简单，但是需要注意表格内容不要超过一页，否则可能会造成内容被截断的情况。同时，在设置page属性时，需要考虑不同浏览器对于该属性的支持情况。

最后提醒一下，在实现表格在A4纸内的显示时，需要在CSS中加上@media print { }，保证只有在打印时才会生效。