Распечатать заголовок таблицы на последующих страницах - PullRequest
Новая
       0

Распечатать заголовок таблицы на последующих страницах

8 голосов
/ 07 февраля 2011

Я пытаюсь отобразить заголовок таблицы на последующих страницах при использовании функции печати в браузере.Используя Firefox, я могу отображать только заголовок на первой странице.Заголовок определяется тегом.Код следующий: 

<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>

Используйте предварительный просмотр для проверки моего описания.Если вы удалите следующую строку кода 

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

Заголовок появится на всех страницах, как я хочу.Как это исправить?Это кажется вопросом максимальной высоты заголовка таблицы.

Ответы [ 2 ]

2 голосов
/ 26 декабря 2012

не уверен, почему у вас слишком много строк в thead.Код ниже работает довольно хорошо (проверено на Firefox).Я также проверил 20 заголовков таблицы, все еще работает хорошо. 

<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 голосов
/ 07 февраля 2011

Попробуйте использовать <th> вместо <td> в заголовке таблицы для ячеек.Браузер должен автоматически печатать эти заголовки на каждой странице.Также убедитесь, что количество ячеек в каждой строке <tbody> равно количеству ячеек в заголовке.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...