CSS区分Chrome和Firefox

CSS区分Chrome和FireFox

描述:由于Chrome和Firefox浏览器内核不同,对CSS解析有差别,因此常会有在两个浏览器中显示效果不同的问题出现,解决办法如下:

/*Chrome*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .content .test {
        background: #ff0;
    }
}
/*FireFox*/
@-moz-document url-prefix() {
    .content .test {
        background: #f0f;
    }
}
/*IE9+*/
@media all and (min-width:0) {
    .content .test{
        background: #f009;
    }
}

/*IE10+*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .content .test {
        background: #0ff;
    }
}

/*iPhone / mobile webkit */

@media screen and (max-device-width: 480px) {

  .content .test {
       background: #0ff;
    }

}
上一篇:2021 chrome 更新跨域规则,将对网站造成影响


下一篇:本地浏览器无法打开远程服务器的jupyter notebook