C&D

Home My Blog整理一下CSS Hack (Chrome, Firefox, Safari, IE10, IE11)

整理一下CSS Hack (Chrome, Firefox, Safari, IE10, IE11)

编辑于 2017年06月12日13:06 作者:Xie.z

适用于Chrome和Opera的 CSS hack写法

以下两种方法都适用，效果是一样的

/*适用于Chrome和Opera的 CSS hack*/
_::content, _:future, .css_selector:not(*:root) { 
  background-color: ForestGreen;
}
 
/*适用于Chrome和Opera的CSS hack*/
@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {
  .css_selector {
    background-color: ForestGreen;
  }
}

/*适用于Chrome和Opera的 CSS hack*/

_::content, _:future, .css_selector:not(*:root) {

background-color: ForestGreen;

}

/*适用于Chrome和Opera的CSS hack*/

@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {

.css_selector {

background-color: ForestGreen;

}

适用于Firefox的 CSS hack写法

/*适用于Firefox的CSS hack*/
@-moz-document url-prefix() {
  .css_selector {
    background-color: OrangeRed;
  }
}

/*适用于Firefox的CSS hack*/

@-moz-document url-prefix() {

.css_selector {

background-color: OrangeRed;

}

适用于Safari的CSS hack写法

/*适用于Safari的CSS hack*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
  ::i-block-chrome, .css_selector {
    background-color: LightSteelBlue;
  }
}

/*适用于Safari的CSS hack*/

@media screen and (-webkit-min-device-pixel-ratio:0) {

::i-block-chrome, .css_selector {

background-color: LightSteelBlue;

}

适用于Internet Explorer10和11的 CSS hack写法

/*适用于IE10以后的所有版本*/
@media all and (-ms-high-contrast:none){
  .css_selector {
    background-color: LightSkyBlue;
  }
}
 
/*适用于IE11*/
@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, .css_selector {
    background-color: LightSkyBlue;
  }
}

/*适用于IE10以后的所有版本*/

@media all and (-ms-high-contrast:none){

.css_selector {

background-color: LightSkyBlue;

}

/*适用于IE11*/

@media all and (-ms-high-contrast:none){

*::-ms-backdrop, .css_selector {

background-color: LightSkyBlue;

}

上一篇: JQ常用函数集合
下一篇: WordPress常用的一些代码