我为使用引导程序的应用程序构建了2个页面,最终用户在填写一些信息后最终打印提交表单。
我已经为@media print
我正在使用page-break-after
编写样式,将2个容器div分成2页。除了Mac上的Safari之外,所有这些都与预期完全一样。这完全可以在IE9& 10,Firefox,Chrome甚至是PC上的Safari。它还可以在Mac上的Chrome和Firefox上完美打印。除了Mac上的Safari之外,所有打印都完全相同,它会打印更大的东西,将我的第二页推到第3页。
这是我的2个打印页面的基本结构,容器div只有600px宽。
<!-- First Page -->
<div class="container page-break">
<div class="row">
<div class="col-sm-12 center">
IMAGE HERE
</div>
</div>
<div class="row">
<div class="col-sm-12 center">
TEXT HERE
</div>
</div>
<div class="row">
<div class="col-sm-12 center">
ANOTHER IMAGE
</div>
</div>
<div class="row">
<div class="col-sm-7">
MORE TEXT
</div>
<div class="col-sm-5">
MORE TEXT
</div>
</div>
</div>
<!-- /.First Page -->
<!-- Second Page -->
<div class="container page-break">
<div class="row">
<div class="col-sm-12 center">
HEADER IMAGE HERE
</div>
</div>
<div class="row">
<div class="col-sm-12 center">
LONG SET OF TEXT HERE
</div>
</div>
</div>
<!-- /.Second Page -->
任何使用Mac浏览器制作Safari的提示都会很棒。值得一提的是,这些需要在不改变浏览器中的任何打印设置的情况下进行打印。