關於做業中遇到的火狐和谷歌兼容性問題總結

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。