Bootstrap3 is compatible with IE 8 and bootstrap3ie8
We are using the excellent front-end framework of bootstrap recently. This framework is very powerful, the framework contains a drop-down menu, button group, button drop-down menu, navigation bar, navigation bar, breadcrumb, paging, layout, thumbnail, warning dialog box, progress bar, and media objects, bootstrap has been pre-defined. When we create a webpage, we only need to directly call the css in it.
Bootstrap is a responsive layout. You can enjoy excellent layout experience on wide screen computers, normal computers, tablets, and mobile phones. This responsive layout is achieved through the Media Query function of CSS3, and different styles are matched according to different resolutions. The IE8 browser does not support this excellent Css3 feature. Bootstrap writes in the development document how to use it for IE8 compatibility. If you want to be compatible with IE6 and IE7, you can search for bsie (bootstrap2)
Bootstrap is definitely not as perfect as Chrome, Firefox, and IE11 in IE8. Some components do not guarantee full compatibility and require Hack.
1. Use html5 Declaration
<! DOCTYPE html> no space is allowed hereNote: <! Doctype html public "-// W3C // dtd html 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd"> is not feasible
2. Add meta tags
Are you sure you want to display the IE version of this web page
<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" /><meta http-equiv="X-UA-Compatible" content="IE=9" />Note: bootstrap does not support the IE compatibility mode. To enable IE to run the latest rendering mode, add the preceding labels to the page. IE = edge indicates that the latest IE kernel is forcibly used, chrome = 1 indicates that if a browser plug-in for IE6/7/8 or another version is installed, Google Chrome Frame
3. Introduce the bootstrap File
<link href="css/bootstrap/bootstrap.min.css" rel="stylesheet">4. Introduce html5shiv. min. js and respond. min. js.
Allow browsers that do not (fully) Support html5 to "support" html5 tags
<!--[if lt IE 9]><script src="js/bootstrap/html5shiv.min.js"></script><script src="js/bootstrap/respond.min.js"></script><![endif]-->5. Add the 1.x Jquery library.
<script src="js/bootstrap/jquery-1.12.0.min.js"></script>6. Test in IE8 and find a problem where placeholder is not supported. The following is a solution for IE to support placeholder. jquery referenced in this article is passed the test in 1.12.0. jquery is referenced first.
<script type="text/javascript" src="js/bootstrap/jquery-1.12.0.min.js"></script><script src="bootstrap/js/bootstrap.min.js"></script>You can also use other jquery versions to introduce
<script type="text/javascript" src="js/bootstrap/jquery.placeholder.js"></script>Then add the code to the file.
<script type="text/javascript"> $(function () { $('input, textarea').placeholder(); });</script>The code is summarized as follows:
<!DOCTYPE html>Note:
1. IE statement
<! -- [If lte IE 6]> <! [Endif] --> IE6 and earlier versions are visible <! -- [If lte IE 7]> <! [Endif] --> IE7 and earlier versions are visible <! -- [If IE 6]> <! [Endif] --> only IE6 is visible <! [If! IE]> <! [Endif]> versions other than IE <! -- [If lt IE 8]> <! [Endif] --> versions earlier than IE8 are visible <! -- [If gte IE 7]> <! [Endif] --> IE7 and Versions later than IE7 are visibleLte:Is the abbreviation of Less than or equal to, that is, Less than or equal.
Lt:That is, the abbreviation of Less.
Gte:It is short for Greater than or equal to, that is, Greater than or equal.
Gt:That is, the abbreviation of Greater than, which is Greater than the meaning.
! :Is not equal to, and is the same as the non-equal identifier in javascript.2. css and js related to bootstrap3
: Http://pan.baidu.com/s/1getpDjt
Jquery. placeholder. js file https://github.com/mathiasbynens/jquery-placeholder
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
