css媒體查詢來兼容

1，判斷ipad：

@media only screen
and (min-device-width  : 768px)
and (max-device-width  : 1024px){
  樣式
}

2，判斷ipad橫屏：

@media only screen
and (min-device-width  : 768px)
and (max-device-width  : 1024px)

and(orientation : landscape){
  樣式
}

3，判斷ipad豎屏：

@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)

and(orientation : portrait){
  樣式
}

4，判斷i蘋果5：（判斷橫屏豎屏和ipad方法一樣）

@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px){

  樣式
}

5，判斷i蘋果6：（判斷橫屏豎屏和ipad方法一樣）

@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px){

  樣式
}

判斷其他型號類似：就是把手機的分辨率寬高/2