Bootstrap禁用响应式布局

Bootstrap这个前端框架，在前端界可是一款大名鼎鼎的框架，使用Bootstrap不需要很强的设计能力就能设计出很漂亮的网页，这几天在开发一个创业项目，PC端web就打算使用Bootstrap来进行开发，但是又想去掉Bootstrap的响应式效果，于是乎就在网上找了教程，发现了网上的教程的效果好像不太适用了新版本，于是自己摸索了下，跟大家来一起分享下去掉Bootstrap响应式的几个步骤：

1.移除标签
禁用响应式布局的第一步买就是移除在head标签中添加的meta标签，如下所示：

<meta name="viewport" content="width=device-width, initial-scale=1.0”>

对这个标签做一个简单的解释，这个标签的作用在于使得你的网站在移动设备端访问的时候，不会进行缩放，而是以100%的比例显示在移动设备中。

2.设置container类的宽度
禁用的第二步是为.container类设置一个宽度，从而覆盖它根据设备宽度而自动调节的功能，网上找到的教程普遍只对container类设置一个宽度，这里我们给container设置一个最大宽度为none，并且全部设置为!important，保证能覆盖原来的Bootstrap样式，如下所示：

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

3.删除折叠菜单
倘若你采用了导航栏，那么就要注意删掉菜单在移动端的折叠样展开式（主要通过button的navbar-toggle来实现）。
4.栅栏布局
除此之外，如果你采用了栅格布局，那么就要采用.col-xs-（最小设备栅格类）的样式来代替.col-md-以及.col-lg-*，这样就能确保栅格能够在所有设备中展开。
通过以上几个步骤，你便可以禁用自己项目中的响应式布局，还等什么？快试试吧！Bootstrap中文网链接：http://www.bootcss.com/
不得不提下，如果手记这里的可视化编辑器能想wordpress那样就不错，体验感会强一点，以前在自己的博客上写文章，发现慕课手记也是一个不错的地方，希望在这里能跟大家一起多多学习。

作者： 串猪神 
链接：http://www.imooc.com/article/14451
来源：慕课网
本文原创发布于慕课网 ，转载请注明出处，谢谢合作！