3

我有一个页面，其中放置了 3 个 iframe，其中显示了其他 3 个页面。一切都包裹在一个大的 DIV 元素中，每个 iframe 都包裹在自己的 DIV 元素中。在每个 DIV 之间，我使用以下 CSS 代码放置另一个 DIV 元素：

@media print { .page-break {display:block; page-break-before:always;} }

在 Firefox（在这种情况下为版本 12，但我想这不是版本问题）中，一切都与打印整个页面的预期相同，但在 IE8 中，分页符 CSS 似乎根本不起作用，并且页面在打印时弄乱了。

我在这里遇到了一个答案，即此分页符不适用于定位元素，但在我的情况下，具有此 CSS 代码的元素是我在此处描述的 DIV 以及打印页面内容的定位（相对/绝对, float) 仅在页面源中完成，包含在 iframe 中而不是在主页中，所以我不确定这是我在这里遇到的情况的原因。

为了让这个分页符在 IE8 上也能正常工作，我需要做什么？

这是主页面的代码：

<style>
@media print { .page-break {display:block; page-break-before:always;} }
</style>

<div align="left">
<div id="frame_gop" align="left" style="width:759px;height:980px;">
<iframe src="page1.html" width="759" height="980" frameborder="0" align="left"></iframe>
</div>
<div class="page_break"></div>
<div id="frame_report" align="left" style="width:759px;height:980px;">
<iframe src="page2.html" width="759" height="980" frameborder="0" align="left"></iframe>
</div>
<div class="page_break"></div>
<div id="frame_release" align="left" style="width:759px;height:980px;">
<iframe src="page3.html" width="759" height="980" frameborder="0" align="left"></iframe>
</div>
</div>
4

1 回答 1

1

IE8 不支持@media 查询，请将其删除。只使用简单的类

代替： 

@media print { .page-break {display:block; page-break-before:always;} }

从： 

.page-break {display:block; page-break-before:always;}

谢谢

于 2015-03-25T07:28:28.947 回答