900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > window.print() 实现A4纸张打印及去掉页眉页脚及打印链接

window.print() 实现A4纸张打印及去掉页眉页脚及打印链接

时间:2022-01-19 07:32:38

相关推荐

window.print() 实现A4纸张打印及去掉页眉页脚及打印链接

1、边距为无

<style>/* 布局纵向 */.a4-endwise{width: 1150px;height: 1627px;border: 1px #000 solid;}/* 布局横向 */.a4-broadwise{width: 1627px;height: 1149px;border: 1px #000 solid;}</style>

2、边距为默认

<style>/* 布局纵向 */.a4-endwise{width: 1075px;height: 1568px;border: 1px #000 solid;}/* 布局横向 */.a4-broadwise{width: 1569px;height: 1075px;border: 1px #000 solid;}</style>

完整代码

<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! --><title>测评表</title><!-- Bootstrap --><link href="/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --><!-- WARNING: Respond.js doesn't work if you view the page via file:// --><!--[if lt IE 9]><script src="/html5shiv/3.7.3/html5shiv.min.js"></script><script src="/respond.js/1.4.2/respond.min.js"></script><![endif]--></head><style>.a4-endwise{width: 1075px;height: 1400px;border: 1px #000 solid;overflow: hidden;padding: 0;word-break:break-all;text-align:center;}.a4-endwise table{border: 1px #000 solid;width: 80%;max-width: 80%;margin: 0px 100px;text-align: center;font-size: 20px;}.print{position: fixed;top: 1%;right: 10%;}</style><body><a class="print" href="javascript:;" onclick="preview();">打印</a><!--startprint--><div class="container a4-endwise" id="test"></div> <!--endprint--><!-- jQuery (necessary for Bootstrap's JavaScript plugins) --><script src="/jquery/1.12.4/jquery.min.js"></script><!-- Include all compiled plugins (below), or include individual files as needed --><script src="/bootstrap/3.3.7/js/bootstrap.min.js"></script><script>/*** [打印]* @return {[type]} [description]*/function preview(){bdhtml=window.document.body.innerHTML;//获取当前页的html代码sprnstr="<!--startprint-->";//设置打印开始区域eprnstr="<!--endprint-->";//设置打印结束区域prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)+18); //从开始代码向后取htmlprnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//从结束代码向前取htmlwindow.document.body.innerHTML=prnhtml;window.print();window.document.body.innerHTML=bdhtml;}</script></body></html>

如果大小不合适,微调一下即可

window.print() 去掉页眉页脚及打印链接

页面中添加样式:

<style media="print">@page {size: auto; /* auto is the initial value */margin: 0mm; /* this affects the margin in the printer settings */}</style>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。