关于让bootstrap3兼容ie8

最新推荐文章于 2025-08-08 17:07:36 发布

weixin_34050005

最新推荐文章于 2025-08-08 17:07:36 发布

阅读量78

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/dayezi/p/4702038.html

本文介绍了如何在IE8浏览器上实现Bootstrap响应式设计，通过引入Respond.js并搭建本地服务器解决无法直接访问本地页面的问题。步骤包括引入必要的文件、配置服务器、将HTML文件部署到服务器目录下，最终通过HTTP协议访问以实现IE8兼容性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

官网上有说Internet Explorer 8 和 9 是被支持的，然而，你要知道，很多 CSS3 属性和 HTML5 元素 -- 例如，圆角矩形和投影 -- 是肯定不被支持的。另外， Internet Explorer 8 需要 Respond.js 配合才能实现对媒体查询（media query）的支持。

http://v3.bootcss.com/getting-started/#support-ie8-ie9

不过由于学的不够，在兼容ie8上浪费了太多时间摸索，接下来就给大家介绍一下我的摸索过程，仅供同样是菜鸟的童鞋参考。

同样是官网上说的，由于浏览器的安全机制，Respond. js不能直接在本地访问的页面上发挥正常的功能，如果需要测试ie8响应式特性， 必须通过http协议访问页面（例如搭建apache、nginx等）。

通过http协议访问页面是重点，我是这么做的：

1、将需要的文件引入（官网有页面基本框架 http://v3.bootcss.com/getting-started/#template）

<!DOCTYPE html>
<html lang="zh-CN"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ --> <title>Bootstrap 101 Template</title> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script> <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script> <![endif]--> </head> <body> <h1>你好，世界！</h1> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script> </body> </html>