做一个网页打印的功能,打印出网页某一部分的内容,使用的window.print()区打印,打印的过程中发现打印预览时没办法进行布局和纸张等的设置。如下图,图一为正常情况可设置相关配置,图二为我遇到的情况:
百思不得其解,在网上搜索相关问题,只看到怎么在样式内设置横向纵向或者是纸张大小的通过设置@page的样式,例如:
横向@page { size: landscape; }
纵向@page{ size: portrait; }
A3纸@page{ size: A3; }
后查找了系统内是否包含@page的相关样式,发现在系统的基础样式和bootstrap.css文件中均设置了@page{ size:a3; },固定了打印的纸张大小,就在想是不是因为这样已经固定了纸张的大小所以打印预览的界面就把相关的纸张和布局设置按钮给隐藏了,尝试把所有@page{ size:a3; }样式注释掉,重新查看打印预览界面,正常了。
总结,window.print()打印若要求打印出的格式为固定格式,可通过@page进行相关的设置;若要求用户能够自行设置,则需要去除@page内的size相关样式。
欢迎大家留言交流~