0

网站非常好地转换为 iphone：1-4 和其他具有相同分辨率的手机，但如果我添加到 Iphone 5 的元标记代码，以前的代码不起作用并且所有手机都可以使用 iphone5 代码。

我的代码：

    <link media="only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait)" href="wp-content/themes/chomacki/css/iphone4-portrait.css" type= "text/css" rel="stylesheet" />    
    <link media="only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape)" href="wp-content/themes/chomacki/css/iphone4-landscape.css" type= "text/css" rel="stylesheet" />  

    <link media="only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : portrait)" href="wp-content/themes/chomacki/css/iphone5-portrait.css" type= "text/css" rel="stylesheet" />    
    <link media="only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape)" href="wp-content/themes/chomacki/css/iphone5-landscape.css" type= "text/css" rel="stylesheet" />

我怎样才能使两个代码都起作用？不只是iphone5代码，或者删除iphone5代码的iphone4代码。

4

1 回答 1

0 
<link media="only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait)" href="wp-content/themes/chomacki/css/iphone4-portrait.css" type= "text/css" rel="stylesheet" />    
<link media="only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape)" href="wp-content/themes/chomacki/css/iphone4-landscape.css" type= "text/css" rel="stylesheet" />  

<link media="only screen and (min-device-width : 481px) and (max-device-width : 568px) and (orientation : portrait)" href="wp-content/themes/chomacki/css/iphone5-portrait.css" type= "text/css" rel="stylesheet" />    
<link media="only screen and (min-device-width : 481px) and (max-device-width : 568px) and (orientation : landscape)" href="wp-content/themes/chomacki/css/iphone5-landscape.css" type= "text/css" rel="stylesheet" />

大概就是你想要的。重叠的媒体 CSS 查询不是一个好主意。

于 2013-04-08T18:01:30.153 回答