Bootstrap 3禁用响应桌面窗口调整大小答案

【问题标题】：Bootstrap 3 disable responsive for desktop window resizeBootstrap 3禁用响应桌面窗口调整大小
【发布时间】：2013-10-02 11:04:39
【问题描述】：

bootstrap 3 适用于移动优先方法。所以我的桌面 css 依赖于我的 css 用于较小的设备。我想在桌面浏览器窗口调整大小但不知道如何禁用响应能力。我被定向到http://getbootstrap.com/getting-started/#disable-responsive，它解决了一半的问题。

页面宽度问题已通过以下方式修复

var desktop = screen.availWidth >= '768';
if(desktop)
{
  l=d.createElement('link');
  l.rel  = 'stylesheet';l.type = 'text/css';
  l.href = 'styles/desktop.css';
  l.media = 'all';
  h.appendChild(l);

}

desktop.css

.container{
    max-width: none !important;
    width:970px;}

但它仍在重新流动我的内容，因为当浏览器窗口调整为相应的媒体查询时，引导程序仍在拾取我的列类。例如 col-sm-4、col-sm-offset-4。当它检测到桌面时，我可以使用 javascript 将 col-sm 更改为 col-xs，但是对于超小型设备，偏移量和列排序被禁用。

我是否必须编写自己的 CSS 来覆盖所有不需要的 boostrap？

http://jsfiddle.net/zVAEe/

如有任何建议，我们将不胜感激。
提前谢谢你。

【问题讨论】：

您为什么不直接阅读他们的文档？ getbootstrap.com/getting-started/#disable-responsive
或试试github.com/bassjobsen/non-responsive-tb3
Bootstrap 3 - non-responsive?的可能重复
目前还不清楚问题出在哪里（或者为什么你要编写 JavaScript 来做 Twitter 自己说是 CSS/HTML 的事情）。向我们展示演示，或告诉我们提供的修复程序失败的原因。我的猜测是你错过或误解了一步。
首先感谢您将我引导到确实解决了我一半问题的文档，我已经阅读了它们，即使我不喜欢阅读！正如我所说，我可以使用 .col-xs-* 但这并不能帮助我区分桌面浏览器调整大小和移动设备。我添加了一个jsfiddle。请随时编辑，因为我显然遗漏了一些东西。

标签： javascript css twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

是的，您需要重写 desktop.css 中的一些 CSS。这很容易完成，因为您可以从 bootstrap 的 CSS 文件中复制 CSS，然后重新定义您想要的内容。

我检查了你的 jsfiddle。将此 CSS 添加到 desktop.css 即可：

.col-sm-4 {
    width: 33.33333333333333%;
    float: left;
}

.col-sm-push-4 {
    left: 33.33333333333333%;
}

.col-sm-pull-4 {
    right: 33.33333333333333%;
}

【讨论】：