Browser css various hack, big summary

Source: Internet
Author: User

IE has a long time to feel, in Win10 out a new browser and China's ie6+ users do not popularize the new browser before IE is a pit, so hack this thing still have to master a little. No nonsense direct stickers

Remember before in the project against IE6 hack is this _bakcground: #fff; in fact, this is only for IE6 use.

The yellow part is the selector hack

IE Hack

The hack of IE series browsers are as follows:

<!DOCTYPE HTML><HTML><Head><MetaCharSet= "Utf-8"><Metahttp-equiv= "X-ua-compatible"content= "Ie=edge,chrome=1"><title>Examples</title><Metaname= "description"content=""><Metaname= "keywords"content=""><Linkhref=""rel= "stylesheet"><styletype= "Text/css">Body{    /*common background--everybody knows that.*/     /*background: #ccc;*/    /*IE5 to IE10 background*/    /*background: #f00 \9;*/    /*ie8+*/    /*background: #f00;*/    /*only IE8*/    /*background: #f00 \0/;*/    /*Ie5,ie6,ie7*/    /**background: #0f0;*/    /*Ie5,ie6,ie7*/    /*+background: #0f0;*/    /*Ie5,ie6,ie7*/    /*@background: #0f0;*/    /*Ie5,ie6,ie7*/    /*>background: #0f0;*/    /*Ie5,ie6,ie7*/    /*/background:orange;*/    /*Ie5,ie6,ie7*/    /*#background: #9d55b8;*/    /*Ie5,ie6*/    /*_background: #00f;*/}    /*Ie9,ie10*/: Root Body{background:#f00 \9; };</style></Head><Bodyclass= "Demo">    <P>Manfred Hu</P></Body></HTML>

Which IE6 because IE did not bring the browser to a special test, the other for IE to open the old mode test, can be like me a line of comments off the test.

FireFox Hack
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "Utf-8"><Metahttp-equiv= "X-ua-compatible"content= "Ie=edge,chrome=1"><title>Examples</title><Metaname= "description"content=""><Metaname= "keywords"content=""><Linkhref=""rel= "stylesheet"><styletype= "Text/css">@-moz-document Url-prefix (){body{Background:#ccc;    }}</style></Head><Body>    <P>Manfred Hu</P></Body></HTML>
Chrome and Safari and Opera Hack
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "Utf-8"><Metahttp-equiv= "X-ua-compatible"content= "Ie=edge,chrome=1"><title>Examples</title><Metaname= "description"content=""><Metaname= "keywords"content=""><Linkhref=""rel= "stylesheet"><styletype= "Text/css">@media screen and (-webkit-min-device-pixel-ratio:0){body{Background:#ccc;    }}</style></Head><Body>    <P>Manfred Hu</P></Body></HTML>

This hack is supported by browsers other than Firefox and IE. Is this the rhythm of the pull camp?

All code Pro-test effective, wrong place to welcome the point. ^_^

Browser css various hack, big summary

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.