bootstrap禁止响应式布局

禁用bootstrap响应式

Bootstrap 会自动帮你针对不同的屏幕尺寸调整你的页面,使其在各个尺寸的屏幕上表现良好。下面我们列出了如何禁用这一特性,就像这个非响应式布局实例页面一样。

禁止响应式布局有如下几步:

  1. 移除 此 CSS 文档中提到的设置浏览器视口(viewport)的标签:<meta>
  2. 通过为 .container 类设置一个 width 值从而覆盖框架的默认 width 设置,例如 width: 970px !important; 。请确保这些设置全部放在默认的 Bootstrap CSS 文件的后面。注意,如果你把它放到媒体查询中,也可以略去 !important 。
  3. 如果使用了导航条,需要移除所有导航条的折叠和展开行为。
  4. 对于栅格布局,额外增加 .col-xs-* 类或替换掉 .col-md-* 和 .col-lg-*。 不要担心,针对超小屏幕设备的栅格系统能够在所有分辨率的环境下展开。

针对 IE8 仍然需要额外引入 Respond.js 文件(由于仍然利用了浏览器对媒体查询(media query)的支持,因此还需要做处理)。这样就禁用了 Bootstrap 对移动设备的响应式支持。

推荐阅读

  1. 织梦(dedecms)调用不到{dede:global.cfg_keywords/}等自定义标签值
  2. 如何设置SuiteCRM通过IP访问?【不通过域名访问SuiteCRM】
  3. WordPress上添加Description(描述)和Keywords(关键词)标签代码
  4. 路由功能防火墙和防火墙功能的路由器有什么区别?
  5. 如何在CENTOS 7上安装Apache Cassandra
  6. ISPconfig修改php.ini位置
  7. php-cgi.exe系统错误[phpstudy]
  8. VScode代码编辑器安装后黑屏

4人评论了“bootstrap禁止响应式布局”

  1. Hello, i believe that i saw you visited my weblog thus i came to
    go back the desire?.I’m trying to to find things to enhance my
    web site!I suppose its adequate to use a few of your ideas!!

发表评论

电子邮件地址不会被公开。 必填项已用*标注