How to disable responsiveness in bootstrap3

Bootstrap3 prohibits responsive setting methods: 1. Remove the tag "" that sets the browser viewport; 2. Override the default width of the frame by setting a width value for the ".container" class Settings; 3. Remove the folding and expanding behaviors of all navigation bars.

Recommended: "bootstrap tutorial"

Disable responsive layout

Bootstrap will automatically help you adjust your page for different screen sizes so that it performs well on screens of all sizes. Below we list how to disable this feature, as in this non-responsive layout example page.

There are several steps to disable responsive layout:

• Remove setting browser viewport (viewport) mentioned in this CSS document tag: .

• Override the frame's default width setting by setting a width value for the .container class, such as width: 970px !important; . Make sure these settings are all placed after the default Bootstrap CSS file. Note that you can also omit !important if you put it in a media query.

• If a navigation bar is used, you need to remove the collapse and expansion behavior of all navigation bars.

• For grid layout, add additional .col-xs-* classes or replace .col-md-* and .col-lg-*. Don't worry, the grid system for ultra-small screen devices can be expanded to all resolutions.

• For IE8, an additional Respond.js file still needs to be introduced (because the browser’s support for media query (media query) is still used, processing still needs to be done). This disables Bootstrap's responsiveness support for mobile devices.

The above is the detailed content of How to disable responsiveness in bootstrap3. For more information, please follow other related articles on the PHP Chinese website!