响应式设计：允许用户还查看完整站点答案

【问题标题】：Responsive Design: Allow user to also view Full Site响应式设计：允许用户还查看完整站点
【发布时间】：2012-04-13 03:36:50
【问题描述】：

在使用响应式设计时，是否有办法仍然允许用户查看整个网站？

例如他们在 iPhone 上查看，但想查看完整的站点。他们点击“完整站点”链接，它会向他们显示 1024 像素版本。

【问题讨论】：

【解决方案1】：

如果您使用媒体查询，请仅在具有“响应式”类的正文元素下应用规则。

@media screen and (max-width: 320px) {
  body.responsive {
    color: blue;
  }
}

如果用户不想查看响应式布局，只需从 body 元素中删除“响应式”类，使所有规则无效。您也可以通过 cookie 或其他方法保持用户偏好。

将窗口缩小到不超过 500 像素会使文本变为白色，背景变为蓝色。这取决于具有“响应”类的身体。单击第一段将切换此类，从而切换媒体查询本身的效果。

【讨论】：

【解决方案2】：

我一直在想这个。我成功地使用 jQuery 来修改视口标签，从我目前所知道的情况来看似乎工作得相当好。不需要多个样式表或大量额外的 CSS。

【讨论】：

【解决方案3】：

没有尝试过，但我自己考虑过这个问题。我想您可以使用样式表切换器来停用核心响应式样式表，让用户获得完整版本

切换样式表当然不是一个新概念。这是一篇关于 ALA 大约 2001 年解决切换样式表的文章：http://www.alistapart.com/articles/alternate/

【讨论】：