HTML 페이지 인쇄

내 웹 페이지에 매우 긴 테이블이 있습니다. 인쇄 할 때 표의 마지막 행이 한 페이지에만 표시됩니다 (페이지 상단에만 있음). 나머지 페이지는 비어 있습니다. 다음 페이지에 나는 둥지 테이블을 가지고 있습니다. 왜 다음 테이블이 첫 번째 페이지의 마지막 줄 맨 아래에 있지 않은지 나는 모른다. HTML에서HTML 페이지 인쇄

는 다음과 같은 방법으로 같습니다

이

<table align="left" cellspacing="0" cellpadding="0" border="1"> 
    <thead> 
    <tr>....</tr> 
    </thead> 
    <tbody> 
    <tr>...</tr> 
    </tbody> 
</table> 

<table align="center" width="800" cellspacing="0" cellpadding="0" border="1" style="margin: 0 auto 0 auto; page-break-inside: avoid;"> 
    <tbody> 
    <tr> 
     <td align="left" width="200">xxx</td> 
     <td align="right" width="200">xxx</td> 
     <td align="right" width="200">xxx</td> 
     <td align="right" width="200">x</td> 
    </tr> 
    <tr> 
     <td align="left" width="200"> 
     <td align="right" width="200"> 
     <td align="right" width="200"> 
     <td align="right" width="200"> 
    </tr> 
    <tr></tr> 
</table>

CSS :

background-color: white; 
border: 1px solid #000000; 
border-collapse: collapse; 
border-spacing: 0; 
font-size: 10px; 
vertical-align: middle;

출처

2012-03-22 Java

를 사용하여 페이지를 사용하여 시도 할 것을 비활성화 할 수 있습니다 -break-before/after 속성을 두 번째 테이블에 추가합니다. http://www.w3schools.com/cssref/pr_print_pagebb.asp – SupremeDud

두 번째 테이블에서 'tbody'를 닫지 않았습니다. –

두 번째 테이블 (모든 행에 대해)에 page-break-before : avoid를 추가하면 같은 효과를냅니다. – Java

이 코드를 시도하고 인쇄 미리보기를 할. 나는 두 번째 테이블을 첫 번째 테이블 바로 아래에 놓는다.

<!DOCTYPE HTML> 
<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
     <title>Print of HTML Page</title> 
     <style type="text/css"> 
      table{ 
       width: 800px; 
       background-color: white; 
       border: 1px solid #000000; 
       border-collapse: collapse; 
       border-spacing: 0; 
       font-size: 10px; 
       vertical-align: middle; 
      } 
     </style> 
    </head> 
    <body> 
     <table border="1"> 
      <thead> 
      <tr> 
       <th>Table 1 Header</th> 
      </tr> 
      </thead> 
      <tfoot> 
      <tr> 
       <td>Table 1 Footer</td> 
      </tr> 
      </tfoot> 
      <tbody> 
      <tr> 
       <td>Table 1 Row 1</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 2</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 3</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 4</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 5</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 6</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 7</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 8</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 9</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 10</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 11</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 12</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 13</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 14</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 15</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 16</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 17</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 18</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 19</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 20</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 21</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 22</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 23</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 24</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 25</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 26</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 27</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 28</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 29</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 30</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 31</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 32</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 33</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 34</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 35</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 36</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 37</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 38</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 39</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 40</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 41</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 42</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 43</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 44</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 45</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 46</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 47</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 48</td> 
      </tr> 
      <tr> 
       <td>Table 1 Row 49</td> 
      </tr>                                                                                                                     
      </tbody> 
     </table> 

     <table border="1" style="page-break-inside: avoid;"> 
      <tbody> 
      <tr> 
       <td>Table 2 Row 1 Cell 1</td> 
       <td>Table 2 Row 1 Cell 2</td> 
       <td>Table 2 Row 1 Cell 3</td> 
       <td>Table 2 Row 1 Cell 4</td> 
      </tr> 
      <tr> 
       <td>Table 2 Row 2 Cell 1</td> 
       <td>Table 2 Row 2 Cell 2</td> 
       <td>Table 2 Row 2 Cell 3</td> 
       <td>Table 2 Row 2 Cell 4</td> 
      </tr> 

     </table> 

    </body> 
</html>

출처

2012-04-03 05:32:01 techlead

당신은 당신이 테이블 내부에 위반되기 때문에 별도로

@media print { 
    .... 
}

를 사용하여 인쇄에 사용되는 스타일 시트를 제어 할 수 있습니다, 당신은 아마

@media print { 
    table { 
     page-break-inside: avoid; 
    } 
}

출처

2012-04-03 05:39:08 Starx

HTML 페이지 인쇄

답변

관련 문제