华丽的bootstrap3碰到土鳖IE6

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

之前由于看好很容易上手的bootstrap，然后用这个框架写了个网站，对于不会美工和细致设计的攻城师来说，bootstrap是个界面设计的瑞士军刀，三下五除二就能搞定个不算太丑的页面。

吭哧吭哧工作了一阵，网站功能基本完工，最后要发布时发现要有点麻烦，毕竟当前还是有很大一部分用户生活在IE6\7\8的世界中，真心希望他们能过上好日子。

攻城师就是解决问题的，因此为了能够使古老的IE能够穿上华丽的服装，就只好着手改造一下，修补一下当前的页面，使其不至于惨不忍睹。网上已经有关于让bootstrap适应ie6的解决方案，叫做鄙视IE(bsie),Bootstrap IE6 兼容库，奈何目前我的网站是用bootstrap3编写的，那个鄙视IE是针对bootstrap2.x编写的，但万变不离其宗，就参考鄙视IE的写法，再结合自己的项目做些修改。

工作还在进行中，但思路确定之后只是时间的问题，不至于一开始看到四分五裂的页面时的恐惧与担忧。

其实bootstrap3对于ie8的支持还可以，只要加入类似如下的JS，在ie8中大致能看，需要修改的也只是很少的局部。

大致用到的对于IE的css hack方式为：

.brand{
*border-width: 0;
}
div.col-sm-offset-2{
_margin-left: 8.8%;
}
.nav li {
float: left;
}

也就是“_”：只有IE6才认识，“*”：IE6和IE7都认识，其它的就以if lt IE 8之类的语句来包含针对特定IE浏览器版本的css或js。

另外别忘记定义html的doctype，没有这个标记，版面布局会处于一个很莫名其妙的状态中，调试了老半天大概都不知道是什么情况：<!DOCTYPE html>