0

これが私の質問です。ここで見たいくつかのもの (つまり、CSS: Repeat Table Header after Page Break (Print View) ) に似ていますが、1 つの違いがあります:複数のヘッダーです。

動的テーブルのブレーク後に pagepbreak (印刷プレビュー モード) が発生している現在のテーブル ヘッダーを表示するにはどうすればよいですか?

したがって、これが私のテーブルで、改ページが 2 番目のヘッダーの後に発生した場合...

<table>
    <tr><th>Head Cell 1a</th><th>Head Cell 2a</th><th>Head Cell 3a</th></tr>
    <tr><td>Cell 1a</td><td>Cell 2a</td><td>Cell 3a</td></tr>
    <tr><td>Cell 4a</td><td>Cell 5a</td><td>Cell 6a</td></tr>   

    <tr><th>Head Cell 1b</th><th>Head Cell 2b</th><th>Head Cell 3b</th></tr>
    <tr><td>Cell 1b</td><td>Cell 2b</td><td>Cell 3b</td></tr>

    <!--PAGE BREAK HERE ON PRINT PREVIEW-->
    <tr><td>Cell 4b</td><td>Cell 5b</td><td>Cell 6b</td></tr>
</table>

...改ページ後のヘッダーとして 2 番目のヘッダー (Head Cells 1b、2b、および 3b) を表示できるようにしたいと考えています。つまり、改ページがどこで発生しても、改ページ後に対応するヘッダーを表示したいと考えています。したがって、上の表は改ページ後に次のようになります...

<table>
    <tr><th>Head Cell 1a</th><th>Head Cell 2a</th><th>Head Cell 3a</th></tr>
    <tr><td>Cell 1a</td><td>Cell 2a</td><td>Cell 3a</td></tr>
    <tr><td>Cell 4a</td><td>Cell 5a</td><td>Cell 6a</td></tr>   

    <tr><th>Head Cell 1b</th><th>Head Cell 2b</th><th>Head Cell 3b</th></tr>
    <tr><td>Cell 1b</td><td>Cell 2b</td><td>Cell 3b</td></tr>

    <!--PAGE BREAK HERE ON PRINT PREVIEW-->
    <tr><th>Head Cell 1b</th><th>Head Cell 2b</th><th>Head Cell 3b</th></tr>
    <tr><td>Cell 4b</td><td>Cell 5b</td><td>Cell 6b</td></tr>
</table>

ヘッダーを<thead>タグでラップしてから、css を次のように設定してみました。

table, tr{page-break-after:auto;} 
thead {display:table-header-group;}

しかし、最初のヘッダーはすべてのページで繰り返されるため、私が見ているのは次のとおりです。

<table>
    <thead><tr><th>Head Cell 1a</th><th>Head Cell 2a</th><th>Head Cell 3a</th></tr></thead>
    <tr><td>Cell 1a</td><td>Cell 2a</td><td>Cell 3a</td></tr>
    <tr><td>Cell 4a</td><td>Cell 5a</td><td>Cell 6a</td></tr>   

    <thead><tr><th>Head Cell 1b</th><th>Head Cell 2b</th><th>Head Cell 3b</th></tr></thead>
    <tr><td>Cell 1b</td><td>Cell 2b</td><td>Cell 3b</td></tr>

    <!--PAGE BREAK HERE ON PRINT PREVIEW-->
    <thead><tr><th>Head Cell 1a</th><th>Head Cell 2a</th><th>Head Cell 3a</th></tr></thead>
    <tr><td>Cell 4b</td><td>Cell 5b</td><td>Cell 6b</td></tr>
</table>

この問題を解決できる人がいる場合は、できるだけ早くお知らせください。本当に感謝します！

前もって感謝します！

4

1 に答える 1

0

まず<thead>、1 つのテーブルに複数のタグを含めることはできません。したがって、私がしなければならなかったのは、各セクションを独自の .actaul テーブルにすることでした<thead>。改ページの後に正しいヘッダーが表示されるようになりました。

于 2012-07-13T16:25:10.130 に答える