您的位置：首页 > Web前端 > BootStrap

没写DOCTYPE造成的bootstrap对IE8的不兼容

2014-05-13 17:36 429 查看

由于不是专业前端,不想再和没完没了的HTML样式问题做斗争了,今天愤然研究bootstrap,确实是个好东西!

可是测试代码在IE8上跑的时候不出所料又出问题了,于是我按照网上的介绍引入了respond.js,可是还是不行,继续在百度上谷歌始终找不到进一步的答案了...

HTML代码:

<html>
<head>
<meta charset="utf-8">
<script src="js/jq.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<!-- IE支持 -->

<script src="js/ie_support/respond.min.js"></script>
</head>
<body>
<style type="text/css">
.btn:hover {
color: yellow;
font-weight: bold;
background-color: blue;
}
.btn {
color: green;
}
</style>
<div class="container">
<div class="row">
<div class="col-md-9">
<h1 >测试1<small>123</small></h1>
<div class="row">
<div class="col-md-6" style="background-color: blue;">
<h2>测试2</h2>
</div>
<div class="col-md-6" style="background-color: blue;">
<h2>测试3</h2>
</div>
</div>
<h1 >测试4</h1>
</div>

</div>
<div class="row">
<input type="button" value="按钮" class="btn"/>
<a href="#" class="col-md-4 col-md-offset-4">Skip to main content</a>
</div>

</div>
</body>
</html>

以下是症状

FF下:

IE8下:

再次刷新又变成:

我挠头了半个下午,按下F12查看的时候突然想到IE8中的元素始终没有剧中是不是DOCTYPE没加造成?!

结果我在<html>标签上方加了一行:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

问题解决了!

教训:以后写HTML一定要加上这句啊!!!!!

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航