IE Print Protector让IE支持HTML5新元素的打印样式

2011-08-18 17:42:37  来源:varhi.com 

网页制作Webjx文章简介:在IE浏览器中打印HTML5元素 (IE Print Protector).

在IE浏览器中打印HTML5元素

IE浏览器的 6 7 8版本无法识别HTML5的新元素.IE 对待无法识别的元素将使用空的<section>和</section>空元素.这也意味着未知元素的内容也不会包含他们的内容,他们无法被定义样式和将溢出的内容包含到它本身的DOM节点中.
下面的这个例子,我们将用 article包含一个有些文字的标题和段落.

1
2
3
4
5
6
7
8
<article>
    <h1>
        Lorem ipsum
    </h1>
    <p>
        Dolor sit amet, consectetur adipisicing elit.
    </p>
</article>

因为IE浏览器将article解析成一个空元素,标题元素和段落都将溢出.

1
2
3
4
5
6
7
<article />
<h1>
    Lorem ipsum
</h1>
<p>
    Dolor sit amet, consectetur adipisicing elit.
</p>

IE Print Protector 的工作原理

将这些元素展现在视图里面.IE Print Protector 需要一个辅助工具,一小段 JS 代码,帮助IE浏览器支持这些HTML5标签.为了让这些标签元素能够打印出来,当打印的时候,IE Print Protector 临时的将 HTML5 元素作了替换,将其替换成可以支持的元素(比如 div 和 sapn).IE Print Protector 也会在已有样式表的基础上生成一个特殊的样式表,这也意味着你可以更保险的对他们定义样式通过 link,style和@import和 @media的方法.IE Print Protector 保存了页面的原始HTML5元素. 所有这些元素的表现和事件没有任何影响.

IE Print Protector 如何生效

未使用 IE Print Protector
IE 无法打印HTML5标签
使用 IE Print Protector
IE 打印HTML5标签的方法
下载IE Print Protector

IE Print Protector
Minified JS (1.29KB) (736 bytes gzipped)
Uncompressed JS (2.91KB)

项目地址:IE Print Protector

中文原文:如何让IE支持HTML5新元素的打印样式
项目地址:IE Print Protector

更多