有问题的网站在这里:
http://autisticadovcacy.uniongraphics.org
我最初使用一个 css 文件设计默认、打印和移动样式，使用
@media print和 @media only screen and (max-width: 480px), only screen and (max-device-width: 480px)将这些样式分开。
我还有单独的样式表，用于一些与可访问性相关的修改(字体大小增加、对比度更改)。我正在使用 PHP stylesswitcher 脚本来允许用户手动切换这些样式。我像这样链接到标题中的样式切换器:
<link rel="stylesheet" href="/wp-content/themes/asan/css/switcher.php?default=style.css" type="text/css" />
并将默认样式定义为style.css .
在客户表示他们希望为用户提供一种从移动设备切换回默认布局的方法之前，这一切都运行良好。我想我会把我所有的移动样式都拉到一个单独的样式表中，在头文件中添加一个额外的链接以使用与以前相同的媒体查询加载该样式表，然后在页脚中添加一个样式切换链接以允许用户如果愿意，可以切换回主样式表。
但是当我从主样式表中删除我的移动样式并在加载主样式表后在标题中添加这一行时:
<link media="handheld, only screen and (max-width: 480px), only screen and (max-device-width: 480px)" rel="stylesheet" type="text/css" href="/wp-content/themes/asan/css/mobile.css" />
...不知何故，移动端样式不再排在最后。正在加载 mobile.css 文件，但只显示标记为 !important 的样式；其他一切都默认为主样式表。
我想这可能是因为移动样式表是在 stylesswitcher 脚本之外加载的，所以我尝试了
<link media="handheld, only screen and (max-width: 480px), only screen and (max-device-width: 480px)" rel="stylesheet" type="text/css" href="/wp-content/themes/asan/css/switcher.php?default=mobile.css" />
但这也不起作用。
有人能发现我的设置错误吗，和/或推荐一种更好的方法来允许用户在标准 View 和移动 View 之间切换(除了创建一个完全独立的移动网站并使用重定向，我正在希望避免)？
最佳答案
对于处理此问题的其他人——我使用了 Device Theme Switcher WP 插件:https://github.com/jamesmehorter/device-theme-switcher/ .该插件允许您为手持设备和平板电脑定义单独的主题，并使用用户代理检测将访问者发送到适当的主题，而且还允许您在移动布局中包含一个“查看完整站点”链接，以便用户可以返回到标准 View ，如果他们想要。
关于php - 使用 css/php stylesswitcher 在移动和标准 View 之间来回切换，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9458435/