titre du tableau de répétition lors de l'impression

J'ai utilisé de la table pour afficher la liste des enregistrements. Il y a beaucoup de lignes et de colonnes. Si je imprimer ce tableau le titre du tableau d'affichage en première page. Après la première page, les en-têtes ne sont pas afficher. J'ai trouvé beaucoup de site web à partir d'une recherche sur Google. J'ai suivi cette méthode, mais je ne pouvais pas l'atteindre. Je ne pouvais pas compte de l'erreur. C'est mon css.

<style type="text/css" media="print" >
table td {
    border-bottom:1px solid gray;
}
th {
font-family:Arial;
color:black;
background-color:lightgrey;
}
thead {
    display:table-header-group;
}
tbody {
    display:table-row-group;
}
</style>

Voici mon code Html:

<table border="0" cellpadding="2" cellspacing="0">
    <thead>
        <tr>
            <th>ID</th>
            <th>First Name</th>
            <th>Last Name</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>First Name 1</td>
            <td>Last Name 1</td>
        </tr>
    </tbody>
</table>

Quelqu'un peut m'aider? Merci.

InformationsquelleAutor Shalini Subramani | 2012-09-15
  1. 1

    Essayez d'ajouter ceci dans votre CSS :

      @media print
 {
   thead {display: table-header-group;}
 }
    • J'ai déjà compris ce css. Mais ça ne fonctionne pas
    • En fait votre css fonctionne bien, Avoir un regard sur ce violon - jsfiddle.net/6kEtv Imprimer la fenêtre par le bouton imprimer de la fin, et de sauvegarder l'impression que .xps ou .pdf. Les en-têtes apparaissent en haut de chaque page.
    • Il fonctionne sur Firefox v11, mais pas sur Chrome v24.
    • table-header-group; ne fonctionne pas sur Chrome. Voir code.google.com/p/chromium/issues/detail?id=24826 pour le rapport de bug
    • Merci @Josias. Espérons qu'ils corriger ce bug. J'ai déjà voté.
    • Il ne fonctionne pas dans Chrome (Webkit) - 6 ans après ce bug est signalé, Google n'a toujours pas résolu !!!! code.google.com/p/chromium/issues/detail?id=24826
    • Firefox: Il ne fonctionne que si le css se tient à l'intérieur de l' @media print{}!!

    InformationsquelleAutor ygssoni
  2. 0

    Voici l'exemple de
    Tout d'abord, vous devez définir explicitement la table de la tête et du corps:

       <table>
   <thead>
  <tr>
     <th>First Heading</th>
     <th>Second Heading</th>
     <th>Third Heading</th>
  </tr>
 </thead>
 <tbody>
  <tr>
     <td>foo</td>
     <td>bar</td>
     <td>baz</td>
  </tr>

    . . .

  <tr>
     <td>fim</td>
     <td>fam</td>
     <td>fom</td>
  </tr>
</tbody>
</table>

    Si vous souhaitez l'impression de travailler, vous avez besoin d'une déclaration explicite. Ensuite, vous avez juste besoin d'une seule ligne de CSS pour faire avancer les choses:

                  @media print {
thead {display: table-header-group;}
}

    Cela forcera la plupart des navigateurs de répéter le contenu de thead nœud sur chaque page imprimée.

    InformationsquelleAutor GANI