如何创建具有 A4 页面大小的打印视图并修复每页的边框
Posted
技术标签:
【中文标题】如何创建具有 A4 页面大小的打印视图并修复每页的边框【英文标题】:how to create print view with A4 page size and fix border per page 【发布时间】:2013-09-16 11:46:58 【问题描述】:我在 php 的 html gen 上有一个大页面 并想用 html 和 css 创建打印视图 我使用 print.css 样式创建此页面 然后有一些问题:
-
如何制作A4大小的页面
如何为所有页面和每个页面创建边框
如何在任何浏览器中创建固定尺寸视图?
有 php 类来生成这个?
感谢您的回答 :)
【问题讨论】:
你可以使用 javascript。 "window.print()" 打印当前窗口。 【参考方案1】:依据:
在您的CSS
打印样式上添加用于打印的媒体查询并使用@page
规则
@media print
@page
size: auto; /* auto is the initial value */
size: A4 portrait;
margin: 0; /* this affects the margin in the printer settings */
border: 1px solid red; /* set a border for all printed pages */
有生成这个的 php 类吗?
我不认为你真的需要额外的库来做到这一点。但是,您可能需要一些浏览器兼容性……不是吗?
编辑
要支持 IE10+,您可能还需要添加此规则:
/* IE10+ CSS print styles */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active)
/* IE10+ CSS print styles go here */
@page
size: auto; /* auto is the initial value */
size: A4 portrait;
margin: 0; /* this affects the margin in the printer settings */
border: 1px solid red; /* set a border for all printed pages */
您应该能够仅使用 CSS 来管理自己以打印网站内容。
【讨论】:
【参考方案2】:这可能对你有帮助
<div id="printpage">
//blah blah
</div>
<a href="#" onclick="printdiv()">Print</a>
function printdiv()
//your print div data
//alert(document.getElementById("printpage").innerHTML);
var newstr=document.getElementById("printpage").innerHTML;
var header='<header><div align="center"><h3 style="color:#EB5005"> Your HEader </h3></div><br></header><hr><br>'
var footer ="Your Footer";
//You can set height width over here
var popupWin = window.open('', '_blank', 'width=1100,height=600');
popupWin.document.open();
popupWin.document.write('<html> <body onload="window.print()">'+ newstr + '</html>' + footer);
popupWin.document.close();
return false;
【讨论】:
这是将页面大小设置为 A4 的好方法,但如何为每页创建页面和边框? 这可能会帮助你:***.com/questions/14397158/…以上是关于如何创建具有 A4 页面大小的打印视图并修复每页的边框的主要内容,如果未能解决你的问题,请参考以下文章