本文出至：学新通博客
一、隐藏页头页脚 使用CSS
@page {
/* margin: 0mm; */
}
@page {
size: auto;
/* auto is the initial value */
margin: 0mm 10mm 0mm 10mm;
/* this affects the margin in the printer settings 最关键的还是这个*/
}二、JS打印
//使用jqprint 进行打印
$('.print').click(function () {
$(".print-content").jqprint({
debug: false, //如果是true则可以显示iframe查看效果（iframe默认高和宽都很小，可以再源码中调大），默认是false
importCSS: true, //true表示引进原来的页面的css，默认是true。（如果是true，先会找$("link[media=print]")，若没有会去找$("link")中的css文件）
printContainer: true, //表示如果原来选择的对象必须被纳入打印（注意：设置为false可能会打破你的CSS规则）。
operaSupport: true//表示如果插件也必须支持歌opera浏览器，在这种情况下，它提供了建立一个临时的打印选项卡。默认是true
});
});三、代码示例
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>学新通测试打印</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<script src="http://www.jq22.com/jquery/jquery-migrate-1.2.1.min.js"></script>
<script src="https://www.jq22.com/demo/dayin/jquery.jqprint-0.3.js"></script>
</head>
<body>
<div>
<button class="print">打印按钮</button>
</div>
<div class="print-content">
<style>
* {
margin: 0;
padding: 0;
}
@page {
/* margin: 0mm; */
}
@page {
size: auto;
/* auto is the initial value */
margin: 0mm 10mm 0mm 10mm;
/* this affects the margin in the printer settings 最关键的还是这个*/
}
</style>
学新通测试打印
</div>
<script>
// 打印
$('.print').click(function () {
$(".print-content").jqprint({
debug: false, //如果是true则可以显示iframe查看效果（iframe默认高和宽都很小，可以再源码中调大），默认是false
importCSS: true, //true表示引进原来的页面的css，默认是true。（如果是true，先会找$("link[media=print]")，若没有会去找$("link")中的css文件）
printContainer: true, //表示如果原来选择的对象必须被纳入打印（注意：设置为false可能会打破你的CSS规则）。
operaSupport: true//表示如果插件也必须支持歌opera浏览器，在这种情况下，它提供了建立一个临时的打印选项卡。默认是true
});
});
</script>
</body>
</html>本文出至：学新通博客
标签：
赏
版权声明：本站内容均来自互联网，仅供学习及演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系，我们将在24小时内删除。
联系方式：wuliqiang_aa@163.com
