小编Lui*_*ulo的帖子

在Google Chrome浏览器中打印表格时，内容与标题重叠

打印带有HTML代码的表格时，Google Chrome浏览器出现问题。我需要创建一个带有标题的文档，并且要实现此目的，我正在使用带有thead元素的表，因此浏览器将为打印文档的每个页面复制该文档。

问题是当<tr>元素内有分页符时，内容与标题重叠。跟着打印出问题，并给出要点。

印刷品

iframe {
  height: 400mm;
  width: 300mm;
  page-break-after: always;
}

.barcode {
  font-family: 'c39hrp36dltt';
  font-size: 4em;
}

.document {
  width: 100%;
  height: 100%;
  page-break-after: always;
  font-family: 'Arial';
}

.dont-break-inside {
  page-break-inside: avoid;
}

.huge {
  font-weight: 700;
  font-size: 3em;
}

.title {
  text-align: center;
  background-color: #a9a9a9;
  font-weight: 700;
  padding: 5px;
}

.line {
  border-bottom: solid 1px #727273;
  margin-top: 25px;
  width: 100%;
}

.center {
  vertical-align: middle;
  margin-left: 4cm;
}

.cover-infos {
  width: 21cm;
  border: 1px solid; …

Run Code Online (Sandbox Code Playgroud)

html css printing google-chrome css-paged-media

Lui*_*ulo

2017 08-25

5
推荐指数

1
解决办法

2305
查看次数