页面打印如何分页

来源:互联网 发布:域名续费便宜 编辑:程序博客网 时间:2024/05/18 01:22
 

<html>

<head>
<title>printer</title>

<meta content="text/html;charset=gb2312" http-equiv="content-type"></meta>

<!--用本样式在打印时隐藏非打印项目-->
<style media=print>  
    .Noprint{display:none;}  
</style>

<!-- 两个样式表定义块必须分开,因为style标签的属性不同 -->
<style>
    .PageNext{page-break-after: always;}<!--控制分页-->
    .style8 {font-size: medium; color: #000066; }
</style>

</head>


<body leftmargin="0" topmargin="0" rightmargin="0" bottommargin="0">
    <TABLE width="100%" height="100" border="1" bordercolor="#000066">
        <Tr>
            <TD align="center" bgcolor="#FFFFFF"><span class="style8">第一页</span></TD>
        </Tr>
    </TABLE>

    <!-- 下面这个网页元素就是用于打印时分隔页面-->
    <div id="pageNext1" style="visibility:hidden;">
        <p class="PageNext"></p>
    </div>

    <TABLE width="100%" height="100" border="1" bordercolor="#000066">
        <Tr>
            <TD align="center" bgcolor="#FFFFFF"><span class="style8">第二页</span></TD>
        </Tr>
    </TABLE>

    <!-- 下面这个网页元素就是用于打印时分隔页面-->
    <div id="pageNext1" style="visibility:hidden;">
        <p class="PageNext"></p>
    </div>

    <TABLE width="100%" height="100" border="1" bordercolor="#000066">
        <Tr>
            <TD align="center" valign="top" bgcolor="#FFFFFF"><span class="style8">第三页</span> <br>
                打印时隐藏的Html元素: <br>
                1、
                <input type=button value="表单元素" class="Noprint">
                <p></p>
                2、
                <table border="1" bordercolor="#000000" class="Noprint">
                    <tr>
                        <td>表格元素</td>
                    </tr>
                </table>
                <p></p>
                3、<font class="Noprint">隐藏的文字</font> </TD>
        </Tr>
    </TABLE>
</body>
</html>