CSS媒体查询目标Windows Phone诺基亚Lumia

Question

我使用低于LESS来定位手机和所有其他设备正在工作，但窗口手机位置：相对打破了整个用户界面。

li { 
    @media screen and (max-width: 480px) { 
     position: relative; 
     top: 4px; 
     zoom: 0.5; 
     width: 46px; 
    } 
} 

如何仅针对使用媒体查询的windows phone？

我已经通过下面的解决方案，但他们使用条件CSS标签，我的项目使用LESS。

CSS to target Windows Phone 7

及以下解决方案的目标DPI，大概可能在将来改变的设备。因此这并不能解决我的问题。

@media query to target hi-res Windows Phone 8+?

Answer 1

感谢Zitscher的投入。 但是我发现一个黑客，对我 http://blog.simian.co/en/tips/internet-explorer-10-mobile-css-hacks-windows-phone/ 工作（这可能是有用的人）

@media screen and (-ms-high-contrast: active) and (max-width: 30em), 
(-ms-high-contrast: none) and (max-width: 30em) { 
     width: 130px !important; 
     padding-left:18px !important; 
} 

这就是我一直在寻找。 感谢您的帮助。

Answer 2

我不会仅仅根据媒体查询为某个设备应用样式时依赖。尝试使用检查库is.js（http://is.js.org/#windowsPhone）就像这个例子：

if(is.windowsPhone()) { 
    $('body').addClass('is-windows-phone') 
} 

在您的样式

现在你可以做这样的事情：

body.is-windows-phone ul#fancyWindowsPhoneList li { 
    position: relative; 
    top: 4px; 
    zoom: 0.5; 
    width: 46px; 
} 

希望这有助于！