Iphone 媒体查询：避免继承？

晚上好,

我有一个网站与当前的css优化的桌面体验。我正在开发Iphone css，使用IwebKit5在移动中提供更好的用户体验

我正在使用javascript，解析用户代理以检测要使用的css。我正在寻找一种避免使用javascript的方法，并发现了媒体查询功能

<!--[if !IE]>-->
<link type="text/css" rel="stylesheet" media="only screen and (max-device-width: 480px)" href="mobile.css"/>
<!--<![endif]-->
<link type="text/css" rel="stylesheet" href="desktop.css"/>

这就是我所尝试的，它在桌面上运行良好（Iphone css被忽略），但在Iphone上，我意识到mobile.css和desktop.css都是加载的，所以我试图找到一种方法来避免这种情况。为了避免这种行为，可以添加什么选项

---

谢谢

我相信你的做法是错误的

首先包括

desktop.css

，然后无条件地包括它

然后，在

mobile.css

中添加/覆盖您需要的任何属性

---

绝大多数的

desktop.css

在iPhone上仍然应该是相关的-你应该调整大小/长度，以及在

mobile.css

中的各种元素上的其他小调整，谢谢，但是在这种情况下，我有一个问题，我想在html中添加一个专为iPhone版本添加的元素。如果我在desktop.css中将其设置为“display:none”，在mobile.css中将其设置为“display:inline”，那么它似乎不起作用……如果您先包括桌面css，然后包括移动css，并且您在桌面css中有

#myDiv{display:none}

，在移动css中有

#myDiv{display:inline}

，它就会起作用。如果没有，那么你就做错了别的事情。也许您想要

display:block

而不是

display:inline

？

“似乎不起作用”

是什么意思？内容仍然隐藏着。。。无论如何，您是对的，它通过将“显示”属性设置为“块”来工作。谢谢！