2013-05-06 10 views
1

我創建了一個在Iphone,Ipad和桌面上運行的ASP.NET MVC應用程序。當我嘗試在iphone中運行應用程序時,我的桌面樣式覆蓋了iPhone樣式。如何避免這種情況?我已將我的桌面樣式放在頁面頂部,如下所示。在iphone中覆蓋桌面樣式的問題

<link href="@Url.Content("~/Content/desktop.css")" rel="stylesheet" type="text/css" /> 
    <link type="text/css" rel="stylesheet" href="@Url.Content("~/Content/jquery.mobile-1.0.min.css")" /> 
    <link type="text/css" rel="stylesheet" href="@Url.Content("~/Content/mhome-style.css")" /> 
    <link type="text/css" rel="stylesheet" href="@Url.Content("~/Content/bib.css")" /> 
    <link type="text/css" rel="stylesheet" href="@Url.Content("~/Content/jplayer.blue.monday.css")" /> 

    @* Styles for Iphone *@ 
    <link type="text/css" rel="stylesheet" media="only screen and (min-device-width: 320px) and (max-device-width: 480px)" href="@Url.Content("~/Content/iphone_portrait.css")" /> 
    <link type="text/css" rel="stylesheet" media="screen and (min-width: 321px) and (max-width: 480px)" href="@Url.Content("~/Content/iphone_landscape.css")" /> 
    @* Styles for Ipad *@ 
    <link type="text/css" rel="stylesheet" media="only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)" href="@Url.Content("~/Content/ipad_portrait.css")" /> 
    <link type="text/css" rel="stylesheet" media="only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) " href="@Url.Content("~/Content/ipad_landscape.css")" /> 

回答

1

我不是太有見地的關於asp.net,但它看起來像這個問題可以通過把一個最小寬度媒體查詢桌面上的麥粒腫表是固定的,因此他們沒有得到加載在較小的設備上。

+0

你是對的。非常感謝你的建議。 – JEMI 2013-05-06 09:28:33

+0

將最小寬度設置爲桌面樣式後,我的問題得到解決。 – JEMI 2013-05-06 09:29:31