我知道 TB 应该根据设备提供优化的内容版本,但我确实喜欢让用户控制他们如何查看网站的想法(即,如果他们愿意,可以选择查看桌面版本)。
3 回答
如果单击桌面视图链接或基于用户代理,您可以加载不同的 CSS(无媒体查询)。
如果你想有一个查看桌面版本的链接,你可以附加一个 GET/URL 变量,使你的网站在没有媒体查询 CSS 或只有几个大宽度媒体查询的情况下加载。
如果您想利用 Chrome/Android 浏览器中的“请求桌面站点”功能来提供桌面版本,则需要走用户代理路线。
例如 1. 检查移动端的用户代理 2. 如果不是移动端,不要加载媒体查询 CSS 3. 如果是移动端,加载媒体查询 CSS 以启用响应式布局
这确实剥夺了响应式布局适应不同尺寸显示器或非移动替代设备的能力,仅针对移动设备呈现响应式。
无论哪种方式,您都需要一些逻辑来处理 CSS 切换。如果使用 URL 变量来控制桌面视图,您可以使用 JavaScript 片段轻松完成此操作。用户代理嗅探有点丑陋,最好使用您的本机编程语言完成。
简短的回答是否定的。Twitter bootstrap 是围绕一个流体/响应式网格构建的,该网格可以缩放到您正在查看网站的设备的大小。
为了实现您想要的,您将构建一个单独的移动版网站,并在移动设备上引导用户,并在页面底部提供一个选项来查看完整的网站。
有一种更简单的方法可以强制使用桌面版本。你只需要给 body-tag 一个最小宽度。
例如:
body {
min-width: 1100px;
}
就这样!玩得开心!