Use HTML5 shiv to enable IE to support HTML5

Source: Internet
Author: User
Now more and more browsers have supported HTML5, and Safari on the iPad supports HTML5 perfectly. Therefore, the iPad navigation we make is completely written in HTML5.

IE cannot render HTML5 styles

Internet Explorer users are not our target users at all, but some people always say that our website is messy because Internet Explorer does not know how to render CSS for unidentifiable labels or elements, for example, if

As mentioned above, ie cannot recognize HTML5 tags, so it cannot render styles. Sjoerd Visscher finds a way to force IE to render HTML5 tags, when you create a new Dom element (with the same name as a tag that cannot be recognized by it), ie can render the element without inserting it, and the following bLH can be rendered.

<HTML> <Head> <Style>Blah {color: red ;} </Style> <SCRIPT>Document. createelement ("blah ") </SCRIPT> </Head> <Body> <Blah>Hello! </Blah> </Body> </Html>

Remy sharp sorted out a mini script html5.js and used the above method to allow IE to support all HTML5 labels.

HTML5 Shiv usage

Html5.js must be called within the page head element (because IE must know this element before parsing the element, this JS file cannot be called at the bottom of the page .)

The author has put the JS file on Google Code project and allows everyone to directly call: http://html5shiv.googlecode.com/svn/trunk/html5.js

You can use IE condition annotations to call this JS file, so that non-ie browsers such as Firefox and Safari will ignore this section.Code, So there will be no unnecessary HTTP requests. The following code will only run in IE:

<! -[If IE]>
<SCRIPT src = "http://html5shiv.googlecode.com/svn/trunk/html5.js”> </SCRIPT>
<! [Endif]->

Finally we can look at the effect of http://ipaddh.com/in IE basic display.

 

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.