Css 在媒体查询中使用横向视图和桌面视图进行更改_Css_Media Queries

Css 在媒体查询中使用横向视图和桌面视图进行更改

css

Css 在媒体查询中使用横向视图和桌面视图进行更改,css,media-queries,Css,Media Queries,当桌面分辨率与横向分辨率相同时，我想使7英寸ipad中的横向视图与桌面视图不同。我正在对lanscape使用以下样式，但不希望在桌面与lanscape的宽度匹配时在桌面上出现此样式： @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (max-device-height : 768px) and (orientation : landscape) { /*style g

当桌面分辨率与横向分辨率相同时，我想使7英寸ipad中的横向视图与桌面视图不同。我正在对lanscape使用以下样式，但不希望在桌面与lanscape的宽度匹配时在桌面上出现此样式：

 @media only screen and (min-device-width : 768px) and (max-device-width : 1024px)  and (max-device-height : 768px) 
and (orientation : landscape) {
/*style goes here*/
}

请帮助我解决这个问题。

您可以使用head.js：

它为页面的head元素设置了一系列有用的css类

<html class="js no-mobile desktop no-ie root-section w-1318 gt-240 
gt-320 gt-480 gt-640 gt-768 gt-800 gt-1024 gt-1280 lt-1440 lt-1680 
lt-1920 no-portrait landscape gradient rgba opacity textshadow 
multiplebgs boxshadow borderimage borderradius cssreflections 
csstransforms csstransitions no-touch no-retina fontface domloaded">

您需要的CSS类是：

桌面/无桌面
移动/无移动

甚至大小（它们在调整大小时刷新）：

gt-768/lt-768
gt-1024/lt-1024