Home  >  Article  >  Web Front-end  >  The solution to make Internet Explorer a browser that supports HTML5 (using html5shiv)_html5 tutorial skills

The solution to make Internet Explorer a browser that supports HTML5 (using html5shiv)_html5 tutorial skills

WBOY
WBOYOriginal
2016-05-16 15:48:131698browse

Nowadays, HTML5 is attracting more and more attention, but browsers that support HTML5 are not yet mainstream. In particular, nearly 50% of domestic users still use IE6. Since IE9 that supports HTML5 does not support Xp system installation, this will affect the future For a long time, HTML5 developers will have to consider backward compatibility issues. There are many ways to achieve HTML5 tag or CSS selector compatibility, one of which is generating tag elements yourself.

For the basic principle, see the effect of the following code in IE8, the style has no effect at all.


Copy code
The code is as follows:


< head>



Hello!




In order for the browser to recognize the tag and display the effect of the corresponding style, we can add a piece of js as follows, and you will see a different effect

Copy code
The code is as follows:




<script>document.createElement("mxria")</script>







Now you understand the secret! Yes, it is document.createElement. HTML5 shiv is such a js plug-in that regenerates all HTML5 tags. You need to load the plug-in, then the HTML5 program can be recognized by all browsers.
Download address: http://html5shim.googlecode.com/svn/trunk/html5.js

Simple method of using trunk/html5.js:

The following is the html5.js file quoting Google:

The use of html5shiv is very simple. Considering that IE9 supports html5, you only need to add the following code to the page head:

Copy Code
The code is as follows:


Copy the above code to the head section, remember it must be the head section (because IE must know this element before the element is parsed, so this js file cannot be called from other locations, otherwise it will be invalid)

Of course, you can also take out the code and figure it out yourself:

(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(','),i=e.length;while(i--){document.createElement(e[i] )}})()
Finally add this paragraph to the css:

/*html5*/ article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
Mainly make these html5 tags into blocks, like divs.

Okay, let’s make it simple. In one sentence, it is: quote html5.js to make html5 tags blocky

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn