在Google Chrome中打印表格时，内容与标题重叠
在打印包含HTML代码的表格时，我遇到了谷歌浏览器的问题。我需要创建一个带有标题的文档，为了实现这一点，我使用的是带有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;
border-collapse: collapse;
margin-top: 1cm;
}
.cover-infos td {
border: 1px solid;
padding: 10px;
text-align: center;
}
.header-template {
width: 100%;
margin-right: 10px;
border-collapse: collapse;
}
.header-template tr {
border: solid 1px;
}
.header-template td {
word-wrap: break-word;
padding: 2px
}
.header-template .barcode {
font-family: 'c39hrp48dhtt';
font-size: 5em;
white-space: nowrap;
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<div class="document">
<table id="page">
<thead>
<tr>
<td>
<table class="header-template">
<tr>
<td class="barcode" rowspan="2">
*CQS-51582*
</td>
</tr>
<tr>
<td>
<strong>Curso: </strong>BACHARELADO EM CIÊNCIAS ECONÔMICAS
</td>
<td>
<strong>Disciplina: </strong>MATEMÁTICA FINANCEIRA
</td>
</tr>
<tr>
<td colspan="3" class="title">
Caderno de Questões - Prova Número 1
</td>
</tr>
</table>
</td>
</tr>
</thead>
<tbody>
<tr>
<td>
<div><strong>Questão 1 (0,50)</strong></div>
<div>
<p>
<div>
<div style="text-align:justify">Em qual montante se transforma um capital de R$ 100.000,00 em 6 meses , considerando uma taxa de 3%a.m.? </div>
</div>
</p>
</div>
</td>
</tr>
<tr>
<td>
<div><strong>Questão 2 (0,50)</strong></div>
<div>
<p>
<div>
<div style="text-align: justify;">A amortização é um processo financeiro, pelo qual uma dívida ou obrigação é paga progressivamente por meio de parcelas, de modo que, ao término do prazo estipulado, o débito
seja liquidado (SAMANEZ 2007). <strong>Quais são os sistemas de amortização mais utilizados? Explique e relate cada um dos sistemas.</strong></div>
</div>
</p>
</div>
</td>
</tr>
<tr>
<td>
<div><strong>Questão 3 (0,50)</strong></div>
<div>
<p>
<div>
<div style="text-align:justify">
<div>Imagine que o avô de Jefferson tenha feito, no passado, uma aplicação de R$ 1.000,00. Em seu testamento, colocou a condição de que seu neto resgataria esse investimento quando esta completasse
100 anos, recebendo rendimentos. Veja a tabela que segue:</div>
<table align="center" border="1" cellpadding="0" cellspacing="0" style="width:100%">
<tbody>
<tr>
<td>Taxa anual</td>
<td>Valor aplicado</td>
<td>Em 10 anos</td>
<td>Em 100 anos</td>
</tr>
<tr>
<td>1% ao ano</td>
<td>R$ 1.000,00</td>
<td>R$ 1.104,62</td>
<td>R$ 2.704,81</td>
</tr>
<tr>
<td>2% ao ano</td>
<td>R$ 1.000,00</td>
<td>R$ 1.219,00</td>
<td>R$ 7.244,64</td>
</tr>
<tr>
<td>4% ao ano</td>
<td>R$ 1.000,00</td>
<td>R$ 1.480,24</td>
<td>R$ 50.504,94</td>
</tr>
<tr>
<td>8% ao ano</td>
<td>R$ 1.000,00</td>
<td>R$ 2.158,92</td>
<td>R$ 2.199.761,25</td>
</tr>
</tbody>
</table>
<div><br />
</div>
<div>Essa disparidade dos juros dá-se por conta da diferença da taxa de juros, obtida no caso apresentado, entre 1 e 8% ao ano, pelo longo período de 100 anos - é a mágica dos juros compostos!
Albert Einsten chegou a dizer que "os juros compostos são a força mais poderosa do universo e a maior invenção da humanidade, porque permite uma confiável e sistemática acumulação
de riqueza." </div>
<div>Disponível em:< https://www.parmais.com.br/> Acesso em 07 maio 2017 (adaptado).</div>
<div><br />
<strong>No que se refere à capitalização composta, avalie as asserções a seguir e a relação proposta entre elas.</strong><br />
<br /> I. Os juros compostos apresentam uma situação caracterizada por progressão geométrica.<br />
<br />
<strong>Porque</strong><br />
<br /> II. Toda sequência numérica, na qual cada termo, a partir do segundo, é igual ao anterior multiplicado por uma constante, é chamada de progressão geométrica (PG).<br />
<br />
<strong>A respeito dessas asserções, assinale a opção correta.</strong></div>
</div>
</div>
</p>
<ol type="A">
<li>
<p>As asserções I e II são proposições verdadeiras e a II é uma justificativa correta da I.</p>
</li>
<li>
<p>As asserções I e II são proposições verdadeiras, mas a II não é uma justificativa correta da I.</p>
</li>
<li>
<p>A asserção I é uma proposição verdadeira e a II é uma proposição falsa.</p>
</li>
<li>
<p>A asserção I é uma proposição falsa e a II é uma proposição verdadeira.</p>
</li>
<li>
<p>As asserções I e II são proposições falsas.</p>
</li>
</ol>
</div>
</td>
</tr>
<tr>
<td>
<div><strong>Questão 9 (0,50)</strong></div>
<div>
<p>
<div>
<div>Eduardo comprou um carro de forma financiada. O preço à vista do veículo é de R$ 50.000,00. O contrato da operação financeira apresenta uma vigência de 24 prestações mensais, à
taxa de 3,5% a.m. <strong>Sobre o processo de amortização dessa dívida, avalie as afirmativas abaixo.</strong></div>
<div> </div>
<table border="1" cellpadding="0" cellspacing="0" style="width:428px">
<tbody>
<tr>
<td style="height:20px; width:64px"><strong>n</strong></td>
<td style="width:80px"><strong>Prestação</strong></td>
<td style="width:75px"><strong>Juros </strong></td>
<td style="width:95px"><strong>Amortização</strong></td>
<td style="width:115px"><strong>Saldo Devedor</strong></td>
</tr>
<tr>
<td style="height:20px">0</td>
<td>*********</td>
<td>******</td>
<td>************</td>
<td>50.000,00</td>
</tr>
<tr>
<td style="height:20px">1</td>
<td>-R$ 3.113,64</td>
<td>1750</td>
<td>-1.363,64</td>
<td>48.636,36</td>
</tr>
<tr>
<td style="height:20px">2</td>
<td>-R$ 3.113,64</td>
<td>1702,27255</td>
<td>-R$ 1.411,37</td>
<td>R$ 47.224,99</td>
</tr>
<tr>
<td style="height:20px">3</td>
<td>-R$ 3.113,64</td>
<td>R$ 1.652,87</td>
<td>-R$ 1.460,77</td>
<td>R$ 45.764,22</td>
</tr>
<tr>
<td style="height:20px">4</td>
<td>-R$ 3.113,64</td>
<td>R$ 1.601,75</td>
<td>-R$ 1.511,89</td>
<td>R$ 44.252,33</td>
</tr>
<tr>
<td style="height:20px">5</td>
<td>-R$ 3.113,64</td>
<td>R$ 1.548,83</td>
<td>-R$ 1.564,81</td>
<td>R$ 42.687,52</td>
</tr>
<tr>
<td style="height:20px">6</td>
<td>-R$ 3.113,64</td>
<td>R$ 1.494,06</td>
<td>-R$ 1.619,58</td>
<td>R$ 41.067,94</td>
</tr>
<tr>
<td style="height:20px">7</td>
<td>-R$ 3.113,64</td>
<td>R$ 1.437,38</td>
<td>-R$ 1.676,26</td>
<td>R$ 39.391,68</td>
</tr>
<tr>
<td style="height:20px">8</td>
<td>-R$ 3.113,64</td>
<td>R$ 1.378,71</td>
<td>-R$ 1.734,93</td>
<td>R$ 37.656,74</td>
</tr>
<tr>
<td style="height:20px">9</td>
<td>-R$ 3.113,64</td>
<td>R$ 1.317,99</td>
<td>-R$ 1.795,66</td>
<td>R$ 35.861,09</td>
</tr>
<tr>
<td style="height:20px">10</td>
<td>-R$ 3.113,64</td>
<td>R$ 1.255,14</td>
<td>-R$ 1.858,50</td>
<td>R$ 34.002,59</td>
</tr>
<tr>
<td style="height:20px">11</td>
<td>-R$ 3.113,64</td>
<td>R$ 1.190,09</td>
<td>-R$ 1.923,55</td>
<td>R$ 32.079,03</td>
</tr>
<tr>
<td style="height:20px">12</td>
<td>-R$ 3.113,64</td>
<td>R$ 1.122,77</td>
<td>-R$ 1.990,88</td>
<td>R$ 30.088,16</td>
</tr>
<tr>
<td style="height:20px">13</td>
<td>-R$ 3.113,64</td>
<td>R$ 1.053,09</td>
<td>-R$ 2.060,56</td>
<td>R$ 28.027,60</td>
</tr>
<tr>
<td style="height:20px">14</td>
<td>-R$ 3.113,64</td>
<td>R$ 980,97</td>
<td>-R$ 2.132,68</td>
<td>R$ 25.894,93</td>
</tr>
<tr>
<td style="height:20px">15</td>
<td>-R$ 3.113,64</td>
<td>R$ 906,32</td>
<td>-R$ 2.207,32</td>
<td>R$ 23.687,61</td>
</tr>
<tr>
<td style="height:20px">16</td>
<td>-R$ 3.113,64</td>
<td>R$ 829,07</td>
<td>-R$ 2.284,58</td>
<td>R$ 21.403,03</td>
</tr>
<tr>
<td style="height:20px">17</td>
<td>-R$ 3.113,64</td>
<td>R$ 749,11</td>
<td>-R$ 2.364,54</td>
<td>R$ 19.038,50</td>
</tr>
<tr>
<td style="height:20px">18</td>
<td>-R$ 3.113,64</td>
<td>R$ 666,35</td>
<td>-R$ 2.447,29</td>
<td>R$ 16.591,20</td>
</tr>
<tr>
<td style="height:20px">19</td>
<td>-R$ 3.113,64</td>
<td>R$ 580,69</td>
<td>-R$ 2.532,95</td>
<td>R$ 14.058,25</td>
</tr>
<tr>
<td style="height:20px">20</td>
<td>-R$ 3.113,64</td>
<td>R$ 492,04</td>
<td>-R$ 2.621,60</td>
<td>R$ 11.436,65</td>
</tr>
<tr>
<td style="height:20px">21</td>
<td>-R$ 3.113,64</td>
<td>R$ 400,28</td>
<td>-R$ 2.713,36</td>
<td>R$ 8.723,29</td>
</tr>
<tr>
<td style="height:20px">22</td>
<td>-R$ 3.113,64</td>
<td>R$ 305,32</td>
<td>-R$ 2.808,33</td>
<td>R$ 5.914,97</td>
</tr>
<tr>
<td style="height:20px">23</td>
<td>-R$ 3.113,64</td>
<td>R$ 207,02</td>
<td>-R$ 2.906,62</td>
<td>R$ 3.008,35</td>
</tr>
<tr>
<td style="height:20px">24</td>
<td>-R$ 3.113,64</td>
<td>R$ 105,29</td>
<td>-R$ 3.008,35</td>
<td>-R$ 0,00</td>
</tr>
</tbody>
</table>
<div>I. O valor do saldo devedor no quarto período é de R$ 35.861,09. <br /> II. Imediatamente após o pagamento da segunda
parcela, Eduardo terá pago 6,9% do capital total referente aos juros.<br /> III. O valor amortizado no sétimo pagamento é de R$ 1.676,26.<br /> IV. O processo de amortização analisado é o Sistema
de Amortização Constante - SAC.<br />
<br />
<strong>É correto apenas o que se afirma em:</strong></div>
</div>
</p>
<ol type="A">
<li>
<p>I e IV.</p>
</li>
<li>
<p>II e III.</p>
</li>
<li>
<p>I, II e III.</p>
</li>
<li>
<p>I, III e IV.</p>
</li>
<li>
<p>II, III e IV.</p>
</li>
</ol>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
1 个答案:
答案 0 :(得分：1)
该错误在Chromium项目中被报告为issue 621258。该问题的状态在2017年7月5日设置为 Fixed ，但我在Windows 7上看到了Chrome 60.0.3112.113（截至2017年8月25日的当前版本）中的问题。我添加了{ {3}}引起他们的注意。
问题a comment几天后就出现了问题，之后很快被标记为已修复。
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？