2011-02-07 33 views
8

Estoy tratando de mostrar el encabezado de la tabla en las páginas siguientes al utilizar la funcionalidad de impresión de browser. Usando Firefox solo puedo mostrar el encabezado en la primera página. El encabezado está definido por etiqueta. El código es el siguiente:Imprimir el encabezado de la tabla en las páginas siguientes

<html> 
<head> 
    <style type="text/css"> 
     @media print 
     {   
      thead 
      { 
       display: table-header-group;  
      } 
     } 
    </style> 
</head> 
<body>  
    <table> 
     <thead> 
      <tr><td>header1</td></tr> 
      <tr><td>header2</td></tr> 
      <tr><td>header3</td></tr> 
      <tr><td>header4</td></tr> 
      <tr><td>header5</td></tr> 
      <tr><td>header6</td></tr> 
      <tr><td>header7</td></tr> 
      <tr><td>header8</td></tr> 
      <tr><td>header9</td></tr> 
      <tr><td>header10</td></tr> 
      <tr><td>header11</td></tr> 
      <tr><td>header12</td></tr> 
      <tr><td>header13</td></tr>     
     </thead> 
     <tbody> 
      <tr><td> 
      Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/> 
      Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/> 
      Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/> 
      Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/> 
      Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>Text<br/>   
      </td></tr> 
     </tbody> 
    <table> 

</body> 

Usar la vista preliminar para poner a prueba mi descripción. Si extrae la siguiente línea de código

<tr><td>header13</td></tr> 

La cabecera aparecen en todas las páginas como que quiero. ¿Cómo puede solucionar esto? Esto parece una cuestión de altura máxima del encabezado de la tabla.

Respuesta

0

Pruebe usar <th> en lugar de <td> en el encabezado de la tabla para celdas. El navegador debería imprimir automáticamente esos encabezados en cada página. Además, asegúrese de que el número de celdas en cada fila <tbody> sea igual al número de celdas en el encabezado.

+0

intenté con lo que dices pero desafortunadamente no funciona. Por favor prueba con mi ejemplo para ver que no funciona y luego elimina la línea "header 13". Entonces el comportamiento es el esperado. Supongo que es cuestión de altura máxima de la etiqueta thead –

2

no estoy seguro de por qué tiene demasiadas filas en su thead. El siguiente código funciona bastante bien (probado en Firefox). También probé 20 encabezados de tabla, todavía funciona bien.

<html> 
<head> 
    <style type="text/css"> 
     @media print { 
      thead 
      { 
       display: table-header-group; 
      } 
     } 
    </style> 
</head> 
<body> 
    <table> 
     <thead> 
      <tr> 
       <th>header1</th> 
       <th>header2</th> 
       <th>header3</th> 
       <th>header4</th> 
       <th>header5</th> 
       <th>header6</th> 
       <th>header7</th> 
       <th>header8</th> 
       <th>header9</th> 
       <th>header10</th> 
       <th>header11</th> 
       <th>header12</th> 
       <th>header13</th> 
      </tr>    
     </thead> 
     <tbody> 
      <tr> 
       <td>text</td> 
       <td>text</td> 
       <td>text</td> 
       <td>text</td> 
       <td>text</td> 
       <td>text</td> 
       <td>text</td> 
       <td>text</td> 
       <td>text</td> 
       <td>text</td> 
       <td>text</td> 
       <td>text</td> 
       <td>text</td> 
      </tr> 
      <!-- 
       Code is too long to paste. 
       If you're using emmet/zencoding, try to expand 
       the code below to print 1000 rows 

       (tr>(td{text})*13)*1000 
      --> 
     </tbody> 
    <table> 
</body> 
+0

¿Esto es 1 fila frente a 13 filas? –

Cuestiones relacionadas