网站移动兼容性

2023-12-20

如何制作既兼容桌面浏览器又兼容移动浏览器的网站?


针对桌面和移动设备的替代 CSS 文件有一个技巧。在 HTML header 中实现如下:

<head>
<meta name="viewport" content="width=320" />
<link rel="stylesheet" href="mobile.css" type="text/css" media="only screen and (max-device-width: 480px)"/>
<link rel="stylesheet" href="desktop.css" type="text/css" media="screen and (min-device-width: 481px)"/>
<link rel="stylesheet" href="mobile.css" type="text/css" media="handheld"/>
<!--[if IE]>
<link rel="stylesheet" href="desktop.css" media="screen" type="text/css" />
<![endif]-->
</head>

然后,如果您需要移动设备和桌面设备的替代内容,请随意使部分 HTML 在桌面设备上可见并在移动设备设备上隐藏,反之亦然。

已在 iPhone 和 Android 上尝试过。请注意,只需在 ref 标记或 CSS 文件中指定“media="handheld"”即可not做把戏; iPhone 并不认为自己是手持设备。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

网站移动兼容性 的相关文章

随机推荐

  • 无法将 Intellij 与生成的源文件夹一起使用

    相关问题如何配置 IntelliJ IDEA 和 或 Maven 自动添加包含使用 jaxb2 maven plugin 生成的 Java 源代码的目录 https stackoverflow com questions 2644609 h
  • 在 gmail 中通过 PHP 登录时电子邮件尝试失败

    我需要用 PHP 发送电子邮件的帮助 我实际上正在尝试使用 PHP 邮件程序发送电子邮件 不知何故 某些邮件 ID 能够发送电子邮件 但其他一些电子邮件 ID 无法发送 我在 Gmail 中收到一封电子邮件 指出 登录尝试被阻止 有人可以帮
  • 需要 ANSI 92 递归 SQL 语句

    我目前正在将 SQL Server SQL 语句转换为其 ANSI 通用等效项 并且一直坚持使用WITH 语句的递归语句 为了集中讨论这个问题 我将问题简化如下 如果我有两张桌子 报告单位 col1 关键 col2 ParentReport
  • 有终结器但没有 IDisposable 的单例

    这是我从 CLR via C Effective C 和其他资源中对 IDisposable 和终结器的理解 IDisposable 用于确定性地清理托管和非托管资源 负责非托管资源 例如文件句柄 的类应该实现 IDisposable 并提
  • 在视图下方显示 toast 小部件

    对于那些之前在这个项目上帮助过我的人 非常感谢 我的代码不再有任何问题 并且我做了额外的调整 现在该应用程序实际上已经很强大了 我还想做一件事 请参阅屏幕截图layout https i stack imgur com NJW9Y jpg
  • 从 Windows C 函数返回字符串

    我对 C 和 C 中的纯 Windows API 级函数完全是新手 最近一直在尝试 NET 互操作性 我已经构建了一个简单的库 它已成功地将数值 int float 等 返回给 NET 调用者 但我在字符串方面没有那么幸运 我尝试了各种不同
  • jQuery Mobile 重用标题和导航

    我是 jQuery Mobile 的新手 在理解重用标题和常规导航时遇到问题 所以我创建了一个标题 其右侧有一个菜单按钮 单击此菜单栏时 会出现一个弹出窗口 其中包含其他页面的链接 div h1 Home h1 a href popupMe
  • 使用带有 '\xae' 的元素转义列表并打印结果

    我有一个清单L u steve u micheal u pedro xae 当我尝试阅读它时 出现错误 我相信它与 xae 有关 gt gt gt L u steve u micheal u pedro xae gt gt gt gt gt
  • 从java voip开始[关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 我必须编写一个聊天应用程序 能够使用
  • 无法 npm 安装 canvas [Windows 上的 NodeJs]?

    我正在尝试使用 ag psd 包来操作 psd 文件 它仅适用于结构 但如果您也想读取图像数据 则会遇到错误 错误如下 Cannot find module canvas code MODULE NOT FOUND 但如果我尝试安装画布 我
  • 每个派生表必须有自己的别名 - 来自组合降序 MySQL 的错误

    我想通过来自两个不同列的两个 strtotime 时间戳对一个 mysql 表进行排序 我有以下 mysql 命令 SELECT FROM SELECT 1 AS table vid req timestamp AS timestamp t
  • 失败 [INSTALL_FAILED_INVALID_APK]

    当我单击运行刚刚在 Android Studio 0 2 10 中创建的项目并选择我的 Android 通过 USB 连接并通过 USB 进行调试 时 出现以下错误 Waiting for device Target device 0123
  • Twilio 未通过 AWS Lambda 实时发送 WhatsApp 消息

    很抱歉这篇文章很长 但这只是为了更好地解释 因为英语不是我的母语 我正在使用 API Gateway Lambda 通过 POST 请求发送 WhatsApp 消息 我遇到过这种奇怪的行为 看起来 Twilio 需要在 2 个请求或一段时间
  • 如何为 flutter 中的资产创建 APK 扩展文件

    我创建了一个 flutter 应用程序 其中包含大小约为 450mb 的视频资源 我已经在Apple应用商店中成功发布了该应用程序 但 Google Play 不接受我的 APK 因为它超过了 200mb 的限制 我尝试采用创建 APK 扩
  • 在 Visual Studio 2015 中使用 Protractor 测试 ASP.NET Core 应用程序

    我有一个基于核心模板包中的 angular2 模板的 ASP NET Core 项目 我添加了第二个使用 xunit 和量角器进行项目 http dotnetthoughts net end to end testing angularjs
  • 为什么自定义并发队列上的dispatch_sync会死锁

    在自定义并发dispatch queue上使用dispatch sync时 我发现我的应用程序出现间歇性死锁 我正在使用类似于中描述的方法迈克 阿什的博客 http www mikeash com pyblog friday qa 2011
  • Curl 7.43.0 不会在 MSVC 2013 中构建

    在 Visual Studio 2013 中从 cUrl 7 43 0 构建 libcurl w ssl 时 编译器报告以下错误 1 gt 构建开始 项目 libcurl 配置 DLL 调试 DLL OpenSSL DLL LibSSH2
  • 我如何滥用空合并运算符?这是否正确评估“null”?

    我试图在 Unity 的 C 脚本中使用空合并运算符 我的项目脚本运行时设置为 NET 4 x 因此它应该可以正常工作 问题在于 即使 LEFT 操作数的计算结果为 null 它也无法正确返回 RIGHT 操作数 这是一个示例声明不起作用当
  • Terraform:在另一个资源中引用在 for_each 中创建的资源

    当我有一个托管区域时 我可以轻松创建该区域 然后通过按名称引用托管区域 在委托账户中为该区域创建 NS 记录 编辑为了避免混淆 这是我想要实现的目标 但对于多个托管区域并且域的所有者是管理帐户 https dev to arswaw cre
  • 网站移动兼容性

    如何制作既兼容桌面浏览器又兼容移动浏览器的网站 针对桌面和移动设备的替代 CSS 文件有一个技巧 在 HTML header 中实现如下