javascript - 如何为设备使用正确的 CSS

Question

我正在创建一个站点，我应该为不同的设备（pc、ipad、iphone）使用不同的 css 有可能知道人们使用哪个设备来选择 css ？？？

Answer 1

根据媒体类型加载不同的 CSS：

W3C - 媒体类型

Answer 2

您在用户查看网站的平台/设备上获得的最佳信息是浏览器版本，可在 HTTP 标头中找到。移动设备可能会说他们正在使用 Chrome（在 Android 手机上）或 IE（在 Windows Mobile 手机上），但您应该能够从版本信息中发现它是浏览器的移动版本。

您可以使用 JavaScript 动态设置样式，或使用服务器端脚本（ASP、JSP、PHP）来加载 CSS 脚本。您必须使用的内容取决于您的网站是用什么编写的。请注意，让移动设备运行大型 JS 脚本来动态设置样式在移动设备上的性能并不高。

Answer 3

如果@Justin Niessner 的回答没有提供足够的精细控制，您可以尝试从用户代理字符串中检测浏览器/设备。有些人对此不以为然，不能保证准确，但它可能会有所帮助。基本上，在 Javascript 中检测浏览器，然后动态添加正确的样式表。或者，这可以在服务器端完成。