1、用横向打印的css样式,但实际使用发现只有谷歌浏览器能生效
@page {size: landscape;}
2、用要打印的内容放到一个div中,然后用css样式把div旋转90度。
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <style type="text/css"> @media print { .noprint { display: none; } .divPint { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); position:absolute;left:-100px; width: 960px;height:500px;margin-top:250px; border:solid 1px black; display:block; } .divShow { display:none; } } @media screen { .divPint { display: none; } .divShow { padding: 10px; margin: 0px auto; width: 960px;height:500px;border:solid 1px black; } } </style> </head> <body style='padding: 0px; margin: 0px;'> <form id="form1" runat="server"> <div> <div class='divPint'> 我是打印的div </div> <div class='divShow'> 我是显示的div </div> <div style="padding-top: 20px; text-align: center;" class="noprint" id="tool" runat="server"> <input id="Button1" type="button" value="打印" onclick='javascript:window.print();' /> <input id="Button2" type="button" value="关闭" onclick='javascript:window.close();' /> </div> </div> </form> </body> </html>
最新评论