Internet Explorer中HTML5元素打印

I was recently working on a website created with HTML5 elements like header, footer, section, and more, and got a rude awakening by Internet Explorer 8. I knew about the hack to ensure the elements render and style as they should on screen...

最近，我在一个使用HTML5元素(如页眉，页脚，节等)创建的网站上工作，并且Internet Explorer 8引起了不礼貌的唤醒。我知道有关确保元素在屏幕上呈现和样式的黑客行为。 。

// For discussion and comments, see: http://remysharp.com/2009/01/07/html5-enabling-script/
(function(){if(!/*@cc_on!@*/0)return;var e = "abbr,article,aside,audio,bb,canvas,datagrid,datalist,details,dialog,eventsource,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,time,video".split(',');for(var i=0;i<e.length;i++){document.createElement(e[i])}})();

..but ensuring styling during print was a whole different story. Despite the JavaScript shim above, the elements still wouldn't style correctly when I went to print. After trying a variety of solutions, my last attempt was the most successful; Modernizr's "print-shiv" extra! This shim wraps your HTML5 elements with printer-friendly elements during the onbeforeprint event, then cleans up after itself when the onafterprint event is fired. There are no special configurations to set, simply include the JavaScript file within the page. Just wanted to pass this quick tip on; head over to GitHub and download it!

..但确保印刷过程中的样式完全不同。 尽管上面有JavaScript垫片，但当我打印时，这些元素仍然无法正确设置样式。 在尝试了各种解决方案之后，我的最后一次尝试是最成功的。 Modernizr的“打印转换”额外功能 ！ 该填充程序在onbeforeprint事件期间将HTML5元素包装为易于打印的元素，然后在触发onafterprint事件后对其进行清理。 无需设置任何特殊配置，只需在页面中包含JavaScript文件即可。 只是想传递这个快速提示； 前往GitHub并下载它 ！

翻译自: https://davidwalsh.name/html5-print