• HTML中利用WebBrowser控件进行打印页面的控制


    我们知道,web中打印并不容易。

    但是利用IE浏览器自带的 Web Browser控件,我们可以轻松地做到控制打印页面设置,包括横向,纵向排列,打印预览等。

    调用该控件很简单,只需要在html代码中加入如下语句即可:

    <object id="WebBrowser" height="0" width="0" classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2">
    </object>

     

    下面我们给出具体代码:

    <html>
    <head>
        
    <title>Use WebBrowser For Print</title>
        
    <style type="text/css">
                .printArea p 
    {
                    margin
    : 0 0;
                    padding
    : 0px 0px 0px 0px;
                
    }

                .printArea pre 
    {
                    margin
    : 0 0;
                    padding
    : 0px 0px 0px 0px;
                
    }

                
                .printButton 
    {
                    border-left-color
    : #3300ff; 
                    border-bottom-color
    : #3300ff; 
                    border-top-style
    : inset; 
                    border-top-color
    : #3300ff; 
                    border-right-style
    : inset; 
                    border-left-style
    : inset; 
                    border-right-color
    : #3300ff; 
                    border-bottom-style
    : inset
                
    }

            
    </style>
    </head>
    <body style="text-align: center">
        
    <form id="form1">
    <object id="WebBrowser" height="0" width="0" classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2">
    </object> 

    <div class="printArea">
                 
    <table>
      
    <tr>
          
    <td style="font-size: 10pt;  500px; text-indent: 8pt; text-align: center; height: 400px;">
            
    <pre>
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
    这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
            
    </pre>
            
    <p>这也是要打印的内容!</p>
            
    <p>这也是要打印的内容!</p>
            
    <p>这也是要打印的内容!</p>
            
    <p>这也是要打印的内容!</p>
           
    </td>
      
    </tr>
      
    <tr>
          
    <td style="text-align: center;">
            
            
    <input id="btnPrint" class="printButton" onclick="document.all.WebBrowser.ExecWB(6,1);" type="button" value="Print"> 
            
    <input id="btnPrintSetup" class="printButton" onclick="document.all.WebBrowser.ExecWB(8,1);" type="button" value="Page Setup" >
            
    <input id="btnPrintPreview" class="printButton" onclick="document.all.WebBrowser.ExecWB(7,1);" type="button" value="Print Preview">
            
          
    </td>
      
    </tr>
    </table>

    </div>

    </form>

    </body>
    </html>

     

  • 相关阅读:
    pku夏令营面试
    机器学习实验一SVM分类实验
    面试相关-转载-well,yzl——持续更新
    2715:谁拿了最多奖学金-poj
    1005:I Think I Need a Houseboat-poj
    2810:完美立方-poj
    2943:小白鼠排队-poj
    rem+媒体查询---移动端 设计稿以375
    微信小程序 + mock.js 实现后台模拟及调试
    一个div 实现纸张阴影效果
  • 原文地址:https://www.cnblogs.com/davidgu/p/1523358.html
Copyright © 2020-2023  润新知