【问题标题】:Why are my print styles not being rendered in IE 7 and IE 8?为什么我的打印样式没有在 IE 7 和 IE 8 中呈现?
【发布时间】:2012-05-25 12:16:51
【问题描述】:

我有一个包含 2 个样式表的网页:

<link rel="stylesheet" href="/assets/css/screen.css" type="text/css" media="all" />
<link rel="stylesheet" href="/assets/css/print.css" type="text/css" media="print" />

打印样式在 chrome、safari、firefox 和 IE9 中运行良好,但在 IE7 和 IE8 中完全中断。某些应该隐藏的图像不是,其他应该可见的图像不是。它看起来像一团糟,尽管如果我在 IE7 和 IE8 中为屏幕加载两个样式表,一切看起来都完全符合我的预期。

很遗憾,我无法链接到该页面,因为它是一个正在进行中的客户网站,但如果有人有任何想法,我会在这里抓住稻草。

【问题讨论】:

    标签: css internet-explorer internet-explorer-8 print-style


    【解决方案1】:

    我认为您需要将打印样式表示为备用...

    <link rel="stylesheet" href="/assets/css/screen.css" type="text/css" media="all" />
    <link rel="alternate stylesheet" href="/assets/css/print.css" type="text/css" media="print" />
    

    其实我觉得那是错的,但我要离开了。

    您可以尝试将打印样式的媒体属性更改为 all,然后将所有内容包装在打印媒体查询的样式表中:

    @media print { … }
    

    【讨论】:

      【解决方案2】:

      这真的是在没有看到你的 CSS 和标记的情况下在黑暗中拍摄,或者至少是其中的一部分!

      position:absolutefixed 的打印元素存在问题,如 cmets 至 this msdn article 中所述;暗示您应该手动重排它们(设置position:static 或可能完全隐藏元素)。处理它的一个核心方法是添加

      * {position:static !important;}
      

      致您的print.css;但它的适用性取决于页面的复杂性以及您希望它的打印方式(即仅文本、标题和徽标或适当设计的体验)。

      如果您还没有决定要提供的打印体验,请考虑阅读另一篇 great article on alistapart 关注的内容!

      【讨论】:

      • 是的,我们已经设计好了样式表,并且在现代浏览器中看起来很棒,在 IE8 之前一切看起来都很好。位置:静态似乎确实有点帮助。印刷标志现在可见,而以前不可见,但不幸的是,事情仍然看起来很不稳定:(
      【解决方案3】:

      事实证明,问题在于 HTML5 元素在打印时无法正确呈现,并且 HTML5 shiv 默认不支持打印。

      对我(和你)来说幸运的是,这里有一个由 Alexander Farkas 制作的 IE 打印保护插件:https://github.com/aFarkas/html5shiv

      编辑:

      如果您使用 Modernizr 来满足您所有的 shiv-ing(完全是一个词)需求,Modernizr 现在似乎有一个打印 shiv 选项:http://modernizr.com/download/

      【讨论】:

      【解决方案4】:

      仅供参考,我在 IE9 和“替代”中遇到了这个问题,即

      <link rel="alternate stylesheet" href="......." type="text/css" media="print" />
      

      在 IE9 中为我工作!

      【讨论】:

        猜你喜欢
        • 2013-07-09
        • 2012-05-10
        • 2011-03-08
        • 2014-11-06
        • 1970-01-01
        • 1970-01-01
        • 2011-11-02
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多