Question

我遇到了bootstrap.js-IE9问题。当我的页面在IE9中加载时，它会一目了然地冻结。使用dev工具强制IE9进入Compability模式可以解决问题。但是，它应该没有这个。

您可以在my mini app进行测试。

该页面相当简单，并且没有任何奇特的功能，您可以在代码中看到：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="/resources/css/main.css"/>
<link rel="stylesheet" type="text/css" href="/resources/css/bootstrap.min.css"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Welkom bij STT!</title>
<script src="/resources/js/jquery-1.9.1.min.js"></script>
<script src="/resources/js/bootstrap.min.js"></script>
</head>
<body>
<div id="main" class="container">

<div class="row" >
    <div class="span1"><span><img src="" alt="Logo" title="Logo"/></span></div>
    <div id="registration" class="span2 btn disabled ">registreer</div>
    <div id="accounting" class="span2 btn disabled ">accounting</div>
    <div id="reporting" class="span2 btn disabled ">rapportage</div>
    <div class="span2"></div>
    <div class="span3"><span>Welcome Jurgen Goossens</span></div>
</div>



<div class="row">
    <div class="span8 well">welkom bij STT!</div>
    <div class="span4"></div>
</div>


<div class="row">
        <div class="span1"></div>
        <div id="customers" class="span2 btn "><a href="/customer/">klanten</a></div>
        <div id="performance" class="span2 btn "><a href="/tasktype/">taken</a></div>
        <div id="users" class="span2 btn "><a href="/user/">gebruikers</a></div>
        <div class="span5"></div>
</div>

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

有没有人知道这与这有什么关系？

Answer 1

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">是“几乎标准”模式。此外，如果doctype-declaration上面有任何内容，IE会自动进入quirksmode。此外，bootstrap requires the html5 doctype，因此您必须用

替换oldschool HTML 4.01 doctype

<!doctype html>

你应该添加

<meta http-equiv="x-ua-compatible" content="IE=Edge"/>

到<head>部分的开头（或者至少在任何脚本标签之前！）。请参阅IE8, IE9 and IE10 Complications（页面中间）。

Answer 2

问题不在于所有的引导:(。经过长时间的搜索，我发现以下自定义CSS代码完成了冻结IE9的技巧：

.btn:first-letter,
label:first-letter,
.navbar-inner .brand:first-letter
{
    text-transform: uppercase;
}

需要进一步了解，但那是另一个任务......

Tnx的帮助

bootstrap.js ie9兼容模式挂起

2 个答案: