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;}
但是由于Bootstrap仍然会在浏览器窗口调整到相应的媒体查询时选择我的列类,所以它仍然会重新流动我的内容。例如col-sm-4,col-sm-offset-4。 当检测到桌面时,我可以使用JavaScript将col-sm更改为col-xs,但是对于超小设备,偏移和列排序被禁用。 我是否需要编写自己的CSS来覆盖所有不需要的Bootstrap?
希望能得到您的建议,非常感谢。
提前致谢。