关于做业中遇到的火狐和谷歌兼容性问题总结

  1. 针对火狐浏览器的CSS Hack:web

    @-moz-document url-prefix() {    .selector {        attribute: value;    }}浏览器

  2. 针对webkit内核及Opera浏览器的CSS Hack:url

    @media all and (min-width:0){    .selector {        attribute: value;/*for webkit and opera*/    }}it

  3. 3

    从这个样式咱们只能把webkit内核的浏览器和Opera浏览器从其它浏览器中区分出来,但并不能区分它们俩,所以咱们还须要在上面样式的基础上再加一个样式:io

    @media screen and (-webkit-min-device-pixel-ratio:0) {    .selector {        attribute: valueForWebKit;/*only for webkit*/    }}class

  4. 4

    因为这个样式是针对webkit的,会把前面的样式覆盖掉,所以,经过这两个样式就能区分出webkit和opera了,opera的属性值取value,webkit的属性值取valueForWebKit。基础

  5. 5

    其实按常规来讲,咱们通常是处理ie上的兼容问题,但遇到须要处理火狐或Chrome的兼容问题时,必定要先查看网页结构是否合理以及便签使用是否规范,直到无可奈何时再使用上面的CSS Hack。select

相关文章
相关标签/搜索