This article mainly introduces the method of HTML5 Shiv to perfectly solve the problem of IE (IE6/IE7/IE8) being incompatible with HTML5 tags. Friends in need can refer to the
HTML5 semantic tags and attributes, which can make It is very convenient for developers to implement clear web page layouts. Coupled with CSS3 effect rendering, it is very simple to quickly create rich and flexible web pages.
HTML5’s new tag elements are:
##
<!--[if lt IE9]>
<script>
(function() {
if (!
/*@cc_on!@*/
0) return;
var e = "abbr, article, aside, audio, canvas, datalist, details, dialog, eventsource, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, time, video".split(', ');
var i= e.length;
while (i--){
document.createElement(e[i])
}
})()
</script>
<![endif]--><!--[if lt IE9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]-->
<!--[if lt IE 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <![endif]-->
But no matter which of the above methods is used, the CSS of the new tag must be initialized. Because HTML5 behaves as an inline element by default , to lay out these elements we need to use CSS to manually convert them into block elements for easy layout
/*html5*/
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}But if users of ie6/7/8 disable scripts, it becomes an unstyled "whiteboard" Web page, how should we solve it?
We can follow Facebook's approach, which is to guide users to enter the "/?_fb_noscript=1" page with the noscript logo, and replace the html5 tag with the html4 tag. This is better than It's easier to write a lot of hacks while maintaining compatibility.
<!--[if lte IE 8]>
<noscript>
<style>.html5-wrappers{display:none!important;}</style>
<p class="ie-noscript-warning">您的浏览器禁用了脚本，请<a href="">查看这里</a>来启用脚本!或者<a href="/?noscript=1">继续访问</a>.
</p>
</noscript>
<![endif]-->This can guide the user to open the script, or jump directly to the HTML4 tag design interface.
The above is the entire content of this article. I hope it will be helpful to everyone's study. For more related content, please pay attention to the PHP Chinese website!
Related recommendations:
html5 implements analysis of players compatible with major browsersThe problem that the video tag in html5 cannot play mp4 SolutionThe above is the detailed content of How to use HTML5 Shiv to solve the problem that IE is not compatible with HTML5 tags. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
