横向视图的媒体查询

【问题标题】：Media query for landscape view横向视图的媒体查询
【发布时间】：2013-12-26 18:51:43
【问题描述】：

我需要查询手机 iPhone 5 和 Galaxy S4 横向视图...

她是我的代码，但这里有些问题。

    @media 
(max-width : 800px){
// style

@media 
 (max-width : 360px){  
//style

在 360 分辨率下一切正常，我需要输入横向视图。

这里是EXAMPLE

【问题讨论】：

标签： ios css responsive-design media-queries

【解决方案1】：

来自this site：

iPhone 5 横屏

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : landscape) 
{ 
   /* STYLES GO HERE */
}

三星 Galaxy S4 Landscape（来自here）

@media screen (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi)
  and (device-width: 1920px)
  and (orientation: landscape) {
  /* Your styles here */
}

【讨论】：

【解决方案2】：

对 iPhone 5 使用 device-aspect-ratio - 它没有 16:9 的纵横比。实际上是 40:71。

仅限 iPhone 5：

@media screen and (device-aspect-ratio: 40/71) and (orientation:portrait) {
    /*style here*/
}

仅限 Galaxy S4：

@media screen and (device-width: 320px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) {
    /*style here*/
}

【讨论】：