How bootstrap solves browser compatibility issues

Bootstrap is the most popular HTML, CSS and JS framework for developing responsive layout, mobile-first WEB projects.

Bootstrap comes from Twitter and is currently the most popular front-end framework. Bootstrap is based on HTML, CSS, and JavaScript, and it is simple and flexible. During the development process, we only need to add the corresponding class to the DOM element to call it, making Web development faster.

Let’s get into the topic and talk about Bootstrap 3 browser compatibility issues and their corresponding solutions:

1. Mobile device support

2. PC support

Note: Windows supports IE 8-11.

Please refer to Browser Support for detailed support of Bootstrap 3 on various browsers.

Related recommendations: "Bootstrap Getting Started Tutorial"

As shown above, IE8 is supported. However, many CSS3 properties and HTML5 elements are not supported. For example, Bootstrap's responsive layout is implemented through the Media Query function of CSS3, which matches different styles according to different resolutions. IE8 browser does not support this excellent CSS3 feature. Bootstrap has clearly pointed out in the development documentation that IE8 requires Respond.js to support media queries. According to the official documentation, the author added the following code at the bottom of the

Note: The html5shiv.min.js file does not (fully) support html5. The browser supports html5 tags; the respond.js file allows IE8 to support media queries.

However, when I opened the page in the IE8 browser, I found that the compatibility issue had not been resolved (pit, pit, pit). By consulting relevant information, the author summarizes a few points to note (the key to achieving the effect):

(1) Local debugging requires a Web Server (such as IIS, Apache, Nginx), and simply opening the file locally cannot see the compatibility Effect;

(2) If you find that respond.js and Bootstrap have been referenced, but still no effect, please check whether your Bootstrap uses a CDN file;

(3) Bootstrap3 requires Html5 Document statement;

(4) Jquery version needs to be below 2.0.

The template code is as follows:

The above is the detailed content of How bootstrap solves browser compatibility issues. For more information, please follow other related articles on the PHP Chinese website!