gpt4 book ai didi

html - 如何避免为 ipad 大小的设备加载 CSS 文件 ('between' 移动和全尺寸)?

转载 作者:太空狗 更新时间:2023-10-29 14:16:44 27 4
gpt4 key购买 nike

我有一个在屏幕上看起来很漂亮的应用程序,但是有一个严格的框架,很难在手机和类似设备上使用它。所以我制作了一个特定的 CSS 文件来适应这些设备。没关系,我使用定义一般外观(适用于所有媒体)的 main.css 和对此类设备进行更正的 handheld.css 文件:

<link rel="stylesheet" media="all" type="text/css" href="main.css" />
<link rel="stylesheet" media="handheld,tv" type="text/css" href="handheld.css" />

问题在于,某些设备(如 iPad)在普通屏幕版本下看起来很棒,并且不需要像某些手机那样降级。所以我在我的应用程序中放置了一个链接,该链接设置了一个强制显示在桌面屏幕上的 cookie。问题是我不知道如何强制不加载 handheld.css。 Javascript可能是?但是,怎么办?

最佳答案

使用媒体查询怎么样?

例如,您可以使用它们来定位宽度小于 800 像素的设备。它适用于大多数现代移动浏览器。

为了让 css 只适用于移动版本,我个人更喜欢创建命名空间而不是添加/删除 css 文件。

例如:

  1. 您将 handheld.css 中的所有规则写为“.handheld .classname”。
  2. 对于移动版本,您在正文中添加类“.handheld”。

创建页面的非 js 版本也很有用:默认情况下,主体上有类“.nojs”,并在加载时通​​过 Javascript(如果启用)删除它。

关于html - 如何避免为 ipad 大小的设备加载 CSS 文件 ('between' 移动和全尺寸)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8233788/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com