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

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

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

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

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

3. 3

   从这个样式我们只能把webkit内核的浏览器和Opera浏览器从其它浏览器中区分出来，但并不能区分它们俩，因此我们还需要在上面样式的基础上再加一个样式：

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

4. 4

   由于这个样式是针对webkit的，会把前面的样式覆盖掉，因此，通过这两个样式就能区分出webkit和opera了，opera的属性值取value，webkit的属性值取valueForWebKit。

5. 5

   其实按常规来说，我们一般是处理ie上的兼容问题，但遇到需要处理火狐或Chrome的兼容问题时，一定要先查看网页结构是否合理以及便签使用是否规范，直到迫不得已时再使用上面的CSS Hack。