css控制打印时只显示指定区域

 

CreateTime--2017年9月26日08:16:04

Author:Marydon

css控制打印时只显示指定区域

思路：

　　1.使用打印命令@media print；

　　2.控制执行打印命令时，非打印区域隐藏。

CSS代码

<style type="text/css">
    /* 执行打印命令时，非打印区域隐藏（不会被打印出来） */
    @media print{
        #noPrintDiv {
            display:none;
        }
    }
</style>

HTML代码

<!-- 需要打印的区域 Start --> 
<div id="printDiv">
    打印时显示
</div>
<!-- End 需要打印的区域 --> 
<!-- 不需要打印的区域 Start --> 
<div id="noPrintDiv">
    打印时不显示 
</div>
<!-- End 不需要打印的区域 -->