3

我正在构建网站的移动版本（不是 mobile.domain.com），但只是根据设备提供不同的样式表。

所以我有这样的事情：

<link href="css/style.css" media="screen" rel="stylesheet"/>
    <link href="css/mobile1.css" media="only screen and (max-width: 480px), only screen and (max-device-width: 480px)" rel="stylesheet" type="text/css" />
    <meta name="viewport" content="width = 320px, initial-scale=1" />

我的移动样式表显然只隐藏/显示移动站点上我想要的内容，然后覆盖style.css.

我遇到的问题是我似乎无法找到我没有覆盖的样式。意思是，如果我完全删除 style.css- 该网站看起来很完美。如果我留在那里 style.css，它看起来并不那么完美。

有没有办法让我在页面加载时动态删除 style.css？

或者我会以完全错误的方式解决这个问题。

4

2 回答 2

3

我最终只是给了我的样式表一个 ID 并这样做了：

jQuery('#mainStyleSheet').remove();

我是在检查屏幕尺寸后才这样做的。如果小于 480，那么我删除我的旧样式表。似乎工作得很好 - 虽然不确定这是一个理想的解决方案。

于 2011-07-19T04:32:07.377 回答
0

此示例适用于 Internet Explorer，但您必须找出 iPhone 的正确调用名称：

<!--[if !IE]> //This will target everything except Internet Explorer browsers.
    <link rel="stylesheet" type="text/css" href="style.css"> //Add appropriate stylesheet.
<![endif]-->

<!--[if !iPhone]>
    ...
<![endif]-->

可以工作。我不确定，也没有 iPhone 可以检查这一点。

于 2011-07-19T04:53:31.347 回答