Now we can select a lot of browsers, so there are also a wide variety of browser environments, the same browser also contains a variety of different versions, there are also differences between different versions of the rendering method, i'm afraid they support different HTML5 and CSS3 features. This situation causes Web developers to face a large number of browser types when developing websites. If the development adopts the lowest standards, such as features not supported by IE6, we do not need them, there is no need to write this article, but I think this situation is rare. More development is to use the features they support in modern browsers, in the early days, some downgrade operations were performed on browsers. This is the so-called "progressive enhancement", which is also the focus of this article. Through the following method, we hope that the website will be able to miraculously run better on the lower version of IE browser!
Htmlshiv. js
Remy HTML5shiv uses JavaScript to create HTML5 elements (such as main, header, and footer ). To some extent, the elements created through JavaScript are styleable. We can spend a lot of time thinking about how it works, but who cares? This policy is still required on all product websites.
The Code is as follows:
Selectivizr. js
Selectivizr. js is an incredible resource used to fill unsupported CSS selectors and attributes, including important last-child. In the recent re-design, I embedded selectivizr and won't miss any details on older IE browsers. The following is my implementation code:
The Code is as follows:
Modern projects are absolutely required. It is loaded only in earlier versions of IE.
In addition, the HTML5 browser support script html5shiv has been added to the Modernizr script. We only need to reference Moernizr. for JavaScript files, IE browsers below IE9 support semantic tags added by HTML5, such as nav, section, and article. CSS can also be used to style them.
Condition comment
You must have seen the following most common cases. But whether ugly or not, the code runs exactly as expected:
The Code is as follows:
The above method acts on css to write some style differences for different IE versions. First, determine the IE version used by the user, and then add the class of this version to the tag, which facilitates hack.
Then we can write in the css file as follows:
The Code is as follows:
. Ie6 xxx {};
. Ie7 xxx {};
This is currently the most efficient method that small editors think. This method does not need or wait for JavaScript, and does not need heavyweight JavaScript libraries. The styles class you defined takes effect immediately, and there is no pop-up screen yet.
Although IE is catching up with competitors, the new version of IE has changed dramatically and hopes to reshape the network experience with new IE. However, earlier Internet Explorer versions are still popular in China. The good news is that these resources run well on all modern browsers at a low cost!
