zoukankan      html  css  js  c++  java
  • Bootstrap如何禁止响应式布局 不适配

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

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

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

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

  • 相关阅读:
    7-11
    7-9
    7-8
    7-7
    7-6
    7-5
    7-4
    7-3
    第08次:升级《陋习手记》完善主从UI
    第07次:升级《陋习手记》显示多条数据
  • 原文地址:https://www.cnblogs.com/share123/p/6432325.html
Copyright © 2011-2022 走看看