HTML 页面打印

HTML 页面打印

 

 

//首先要添加代码 ↓↓↓ 
<object id="WebBrowser" classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2" height="0" width="0"></object>

//实现打印功能代码
<input type="button" value="打印" onclick="document.all.WebBrowser.ExecWB(6,1)" />
<input type="button" value="直接打印" onclick="document.all.WebBrowser.ExecWB(6,6)" />
<input type="button" value="页面设置" onclick="document.all.WebBrowser.ExecWB(8,1)" />
<input type="button" value="打印预览" onclick="document.all.WebBrowser.ExecWB(7,1)" /> 

//打印特殊样式
<!--media=print 这个属性可以在打印时有效-->
<style media="print">
　　.Noprint{display:none;} //隐藏不需要的控件
　　.PageNext{page-break-after: always;} //分页打印标记
</style>

 

示例代码

 

<html>
<head>
    <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
    <title>看看</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <!--media=print 这个属性可以在打印时有效-->
    <style media="print">
        .Noprint
        {
            display: none;
        }
        .PageNext
        {
            page-break-after: always;
        }
    </style>
    <style>
        .tdp
        {
            border-bottom: 1 solid #000000;
            border-left: 1 solid #000000;
            border-right: 0 solid #ffffff;
            border-top: 0 solid #ffffff;
        }
        .tabp
        {
            border-color: #000000 #000000 #000000 #000000;
            border-style: solid;
            border-top-width: 2px;
            border-right-width: 2px;
            border-bottom-width: 1px;
            border-left-width: 1px;
        }
        .NOPRINT
        {
            font-family: "宋体";
            font-size: 9pt;
        }
    </style>
</head>
<body>
    <center class="Noprint">
        <p>
            <object id="WebBrowser" classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2" height="0"
                width="0">
            </object>
            <input type="button" value="打印" onclick="document.all.WebBrowser.ExecWB(6,1)">
            <input type="button" value="直接打印" onclick="document.all.WebBrowser.ExecWB(6,6)">
            <input type="button" value="页面设置" onclick="document.all.WebBrowser.ExecWB(8,1)">
            <input type="button" value="打印预览" onclick="document.all.WebBrowser.ExecWB(7,1)">
            <br />
        </p>
    </center>
    <table width="90%" border="0" align="center" cellpadding="2" cellspacing="0" class="tabp">
        <tr>
            <td colspan="3" class="tdp">
                第1页
            </td>
        </tr>
        <tr>
            <td width="29%" class="tdp">
                 
            </td>
            <td width="28%" class="tdp">
                 
            </td>
            <td width="43%" class="tdp">
                 
            </td>
        </tr>
        <tr>
            <td colspan="3" class="tdp">
                 
            </td>
        </tr>
        <tr>
            <td colspan="3" class="tdp">
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                        <td width="50%" class="tdp">
                            <p>
                                这样的报表</p>
                            <p>
                                对一般的要求就够了。</p>
                        </td>
                        <td>
                             
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
    <!--分页-->
    <div class="PageNext">
    </div>
    <table width="90%" border="0" align="center" cellpadding="2" cellspacing="0" class="tabp">
        <tr>
            <td class="tdp">
                第2页
            </td>
        </tr>
        <tr>
            <td class="tdp">
                看到分页了吧
            </td>
        </tr>
        <tr>
            <td class="tdp">
                 
            </td>
        </tr>
        <tr>
            <td class="tdp">
                 
            </td>
        </tr>
        <tr>
            <td class="tdp">
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                        <td width="50%" class="tdp">
                            <p>
                                这样的报表</p>
                            <p>
                                对一般的要求就够了。</p>
                        </td>
                        <td>
                             
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
    <!--分页-->
    <div class="PageNext">
    </div>
    <table width="90%" border="0" align="center" cellpadding="2" cellspacing="0" class="tabp">
        <tr>
            <td class="tdp">
                第3页
            </td>
        </tr>
        <tr>
            <td class="tdp">
                看到分页了吧
            </td>
        </tr>
        <tr>
            <td class="tdp">
                 
            </td>
        </tr>
        <tr>
            <td class="tdp">
                 
            </td>
        </tr>
        <tr>
            <td class="tdp">
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                        <td width="50%" class="tdp">
                            <p>
                                这样的报表</p>
                            <p>
                                对一般的要求就够了。</p>
                        </td>
                        <td>
                             
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</body>
</html>


 
posted @ 2010-10-08 16:14  lxnjy  阅读(14695)  评论(0)    收藏  举报