Recientemente, he estado usando Bootstrap, un excelente marco frontal. Este marco es muy poderoso. El marco incluye menús desplegables, grupos de botones, menús desplegables de botones, navegación, barras de navegación, migas de pan, paginación, composición tipográfica, miniaturas, cuadros de diálogo de advertencia, barras de progreso, objetos de medios, etc. Bootstrap ha sido predefinido. Cuando hacemos una página web, solo necesitamos llamar directamente al CSS por dentro.
Bootstrap es un diseño receptivo, puede obtener una experiencia de diseño muy excelente en computadoras de pantalla panorámica, computadoras ordinarias, tabletas y teléfonos móviles. Este diseño receptivo se logra a través de la función de consulta de medios de CSS3, que coincide con diferentes estilos de acuerdo con diferentes resoluciones. El navegador IE8 no admite esta excelente función CSS3. Bootstrap escribió en el documento de desarrollo cómo usarlo para la compatibilidad IE8. Si quieres ser compatible con IE6 e IE7, puedes buscar BSIE (Bootstrap2)
Bootstrap definitivamente no es tan perfecto como Chrome, Firefox e IE11 en IE8. No se garantiza que algunos componentes sean totalmente compatibles, pero aún necesitan ser pirateados.
1. Use la declaración de HTML5
<! Doctype html> No hay espacios aquí <html>
Nota: Escribir <! DocType html public "-// w3c // dtd html 4.01 // en" "http://www.w3.org/tr/html4/strict.dtd"> no es factible
2. Agregue metaetiquetas
Confirme la versión IE de esta página para mostrar
<meta http-oquiv = "x-ua-compatible" content = "ie = borde, chrome = 1" /> <meta http-oquiv = "x-ua-compatible" content = "ie = 9" />
Nota: Bootstrap no admite el modo de compatibilidad IE. Para habilitar el navegador IE para ejecutar el último modo de representación, la etiqueta anterior se agregará a la página. IE = Edge significa forzar el uso del último kernel IE, y Chrome = 1 significa si el complemento del navegador para IE6/7/8 y otras versiones está instalado.
3. Introducir el archivo Bootstrap
La copia del código es la siguiente: <link href = "css/bootstrap/bootstrap.min.css" rel = "stylesheet">
4. Introducir html5shiv.min.js y respuesta.min.js
Haga que los navegadores que no (completamente) admitan etiquetas HTML5 "admiten" a las etiquetas HTML5
<!-[si LT IE 9]> <script src = "js/bootstrap/html5shiv.min.js"> </script> <script src = "js/bootstrap/respuesta.min.js"> </script> <! [Endif]->>
5. Agregar 1.x versión de jQuery Library
La copia del código es la siguiente: <script src = "js/bootstrap/jQuery-1.12.0.min.js"> </script>
6. Probado bajo IE8, encontré un problema de que el marcador de posición no es compatible. La siguiente es una solución a la solución que admite el marcador de posición. La jQuery citada en este artículo fue aprobada por la prueba 1.12.0. Consulte primero JQuery.
<script type = "text/javaScript" src = "js/bootstrap/jQuery-1.12.0.min.js"> </script> <script src = "bootstrap/js/bootstrap.min.js"> </script>
También puede usar otras versiones jQuery para introducir
[código] <script type = "text/javaScript" src = "js/bootstrap/jQuery.placeholder.js"> </script>
Luego agregue el código al archivo
<script type = "text/javaScript"> $ (function () {$ ('input, textAREA'). PlaceHolder ();}); </script>El resumen del código es el siguiente:
<! DocType html> <html lang = "zh-cn"> <head> <meta charset = "utf-8"> <meta name = "viewport" content = "width = dispositivo-width, user-Scalable content = "ie = borde, chrome = 1"/> <meta name = "autor" content = "zhy"/> <title> ie8 </title> <link rel = "stylesheet" href = "css/bootstrap/bootstrap.min.css"> <! <script src = js/bootstrap/html5shiv.min.js "> </script> <! [endif]-> <script src =" js/bootstrap/jQuery-1.12.0.min.js "> </script <script <script <script> src = "js/bootstrap/bootstrap.min.js"> </script> </head> <body> </body> </html>
Nota:
1. Declaraciones para determinar la versión de IE en IE
< 7]> <! [Endif]->
IE7 y las versiones más grandes que IE7 son visibles
LTE: ¿Es la abreviatura de menos o igual a, lo que significa menos o igual a.
LT: ¿Es la abreviatura de menos de lo que significa menos que?
GTE: ¿Es la abreviatura de mayor o igual, que significa mayor que o igual a.
GT: es la abreviatura de mayor que, que significa mayor que.
! : Significa no igual, lo mismo que el símbolo de juicio no igual en JavaScript
Si aún desea estudiar en profundidad, puede hacer clic aquí para estudiar y adjuntar 3 temas emocionantes a usted:
Tutorial de aprendizaje de bootstrap
Tutorial práctico de bootstrap
Tutorial de uso de complemento de bootstrap
Lo anterior se trata de este artículo, espero que sea útil para el aprendizaje de todos.