您可以删除特定设备的样式表吗？

发布于 2024-11-24 07:45:25 字数 700 浏览 1 评论 0原文

我正在构建网站的移动版本（不是 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 ？

或者我是否以完全错误的方式处理这个问题。

原文

I'm building a mobile version of a site (not a mobile.domain.com) but just serving up a different style sheet based upon the device.

So I have something like this:

<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" />

My mobile style sheet is obviously hiding/showing only what I want on the mobile site, and then overriding classes/styles in the style.css.

The problem I'm having is I can't seem to find what style I'm not overriding. Meaning, if I completely remove style.css - the site looks perfect. If I keep style.css in there, it looks not so perfect.

Is there a way for me to dynamically remove the style.css when the page loads?

Or am I going about this the complete wrong way.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

要走就滚别墨迹 2024-12-01 07:45:25

我最终只是给了我的样式表一个 ID 并执行了此操作：

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

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

I ended up just giving my stylesheet an ID and did this:

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

I did this after checking what the screen size was. if less than 480, then I remove my old style sheet. Seems to work quite well - not sure it's an ideal solution though.

回复收藏 0 原文

何以心动 2024-12-01 07:45:25

此示例适用于 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 来检查这一点。

This example works for Internet Explorer, but you'll have to find out the proper calling name for iPhone:

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