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; 
} 

希望這有助於！