在后续页面中打印表格标题 [英] Print table header in subsequent pages

查看:151
本文介绍了在后续页面中打印表格标题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图在使用browsser打印功能时在后续页面中显示表格标题。
使用Firefox我只能在第一页显示标题。标题由标记定义。
代码如下:

I'm trying to display the table header in subsequent pages when using the browsser print functionality. Using Firefox i'm only able to display the header in the first page. The header is defined by tag. The code is the following:

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

使用打印预览来测试我的描述。
如果您删除以下代码行:

Use print preview to test my description. If you remove the following line of code

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

页眉出现在我想要的所有页面中。如何解决这个问题?
这似乎是表头的最大高度。

The header appear in all pages like I want to. How can a fix this? This seems a matter of max-height of the table header.

推荐答案

不知道为什么你有太多的行在你的 thead 上。下面的代码工作得很好(在Firefox上测试)。我还测试了20个表头,仍然运行良好。

not sure why you have too many rows on your thead. The code below works pretty well (tested on firefox). I also tested 20 table headers, still works well.

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

这篇关于在后续页面中打印表格标题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆