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 对移动设备的响应式支持。

Bootstrap如何禁止响应式布局的更多相关文章

  1. Bootstrap如何禁止响应式布局 不适配

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

  2. bootstrap 自适应和响应式布局的区别

    自适应:  不管屏幕多大,都尽量不换行,而只是横向缩放. 响应式: 屏幕变小了之后,属于同一行的元素受到挤压后,行的右边元素自动换行显式: 屏幕大了后,本属于同一行的元素尽可能的排在同一行内: boo ...

  3. Bootstrap工具包--用于响应式布局和移动设备优先的web项目

    Bootstrap是用于前端开发的工具包,是一个css/html框架 用于响应式布局和移动设备优先的web项目 响应式布局--一个网站能兼容多个终端 有很多版本:v3,v4,v5   三个没啥区别  ...

  4. Bootstrap学习笔记-响应式布局原理

    响应式布局的原理就是利用css3中@media媒体来实现的 <html> <head> <meta charset="utf-8"> <t ...

  5. bootstrap第一天,响应式布局,栅格系统运用

    <!DOCTYPE html><html lang="zh-CN"> <head> <meta charset="utf-8&q ...

  6. Bootstrap实战 - 响应式布局

    一.介绍 响应式布局就是一个网站能够兼容多个终端,而不是为每个终端做一个特定的版本.这个概念是为解决移动互联网浏览而诞生的. 导航栏与轮播在大部分网站的头部占很高的比重,特别是导航栏,扮演着网站地图的 ...

  7. 关于bootstrap和响应式布局

    bootstrap导入 首先需要安装好插件 然后就是在代码器写导入代码 代码如下 <html lang="zh-CN"> <head> <meta c ...

  8. 响应式布局之BootStrap

    本文在于巩固基础 学习bootStrap官网http://getbootstrap.com/ 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,简而言之,就是一个网站能够兼容多 ...

  9. Bootstrap禁用响应式布局

    在Bootstrap中极其重要的一个技术内容便是响应式布局了,一次编码针对不同设备终端的强大能力使得响应式技术愈发流行. 不过正所谓"萝卜青菜各有所爱",如果你想要使用Bootst ...

随机推荐

  1. 动手造轮子:基于 Redis 实现 EventBus

    动手造轮子:基于 Redis 实现 EventBus Intro 上次我们造了一个简单的基于内存的 EventBus,但是如果要跨系统的话就不合适了,所以有了这篇基于 Redis 的 EventBus ...

  2. 【Java】Caused by: com.ibatis.sqlmap.client.SqlMapException: There is no statement named *** in this SqlMap.

    如题: 可能原因: 在xxx.xml文件中有两个标签的id命名相同: DAO实现类方法中没有写对应xxx.xml的id名称: 实体映射文件xxx.xml未加入到sqlMap-Config.xml文件中 ...

  3. 大数阶乘(c++实现)

    #include <iostream>using namespace std;#define N 1000int BigNumFactorial(int Num[], int n);voi ...

  4. (一)Mybatis基本配置,Statement方式,动态代理增删改查

    首先明白Mybatis是干什么的,之前使用jdbc操作数据库时候要写很多语句,获取光标,连接,获取具体对象进行相应操作,代码过于繁琐,所以现在有了Mybatis,它将这个操作整合在了一起,你不需要关心 ...

  5. Windows to Linux API 映射

  6. JAVA基础知识(九)Java 异常

    Throwable是Error和Exception的基类 Exception(异常) :是程序本身可以处理的异常. Error(错误): 是程序无法处理的错误.这些错误表示故障发生于虚拟机自身.或者发 ...

  7. DedeCMS V5.7 SP2前台文件上传漏洞(CVE-2018-20129)

    DedeCMS V5.7 SP2前台文件上传漏洞(CVE-2018-20129) 一.漏洞描述 织梦内容管理系统(Dedecms)是一款PHP开源网站管理系统.Dedecms V5.7 SP2版本中的 ...

  8. Netty学习(七)-Netty编解码技术以及ProtoBuf和Thrift的介绍

    在前几节我们学习过处理粘包和拆包的问题,用到了Netty提供的几个解码器对不同情况的问题进行处理.功能很是强大.我们有没有去想这么强大的功能是如何实现的呢?背后又用到了什么技术?这一节我们就来处理这个 ...

  9. struts的上传下载

    文件上传 添加jar包 commons-io-1.3.2.jar commons-fileupload-1.2.1.jar 前台页面 form表单 method值为post 添加"encty ...

  10. 【0807 | Day 10】字符编码以及Python2/3编码的区别

    一.计算机基础 计算机组成:CPU.内存.硬盘 CPU:控制程序运行(从内存中取出文本编辑器的数据存入内存) 内存:运行程序 硬件:存储数据 二.文本编辑器存取文件的原理 比如计算机只能识别0和1,文 ...