Bootstrap模式显示与否取决于引导程序版本

Question

我对网络编程比较陌生，所以我使用了几个模板来创建我的网站，所有这些模板都与Twitter Bootstrap有关。

我的登录页面正确显示了Bootstrap模式。这些是我在那里使用的进口商品：

<link rel="stylesheet" href="css/bootstrap.css" />
<link rel="stylesheet" href="css/bootstrap-responsive.css" />
<link rel="stylesheet" href="css/custom.css" />
<link type="text/css" rel="stylesheet" href="stylesheet.css" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.js"></script>

问题从登录后的主页开始。它取自另一个模板，它使用以下导入：

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"/>
<link rel="stylesheet" href="css/custom.css" />
<link rel="stylesheet" type="text/css" href="css/dashboard2.css"/>
<link type="text/css" rel="stylesheet" href="stylesheet.css" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.js"></script>

正如您所看到的，唯一的变化是Bootstrap的来源。在第一种情况下，我将其下载到css文件夹，而在第二种情况下，它直接从服务器获取。

因此，模态不会显示在主页面中（第二个）。屏幕渐变为黑色，但没有显示模态。

如果我修改主页的导入以从css文件夹而不是服务器获取Bootstrap，则模式会显示，但整个页面的布局都会被破坏：

<link rel="stylesheet" href="css/bootstrap.css" />
<link rel="stylesheet" href="css/bootstrap-responsive.css" />
<link rel="stylesheet" href="css/custom.css" />
<link rel="stylesheet" type="text/css" href="css/dashboard2.css"/>
<link type="text/css" rel="stylesheet" href="stylesheet.css" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.js"></script>

而不是：

有什么想法吗？

Answer 1

您是否为页面的head标签中的响应添加了元标记。如果没有，请尝试将以下元标记添加到页面的标题中。

<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1">

希望这将解决您的问题。

注意：首先尝试将其添加到导入下载文件的版本中。

Answer 2

经过一些研究后我解决了我的问题，我希望其他人也能从中受益。

这篇文章实际上解决了它：here

显然，Bootstrap 3中模态的语法是不同的，除其他外，它必须包含这些行：

<div class="modal-dialog">
<div class="modal-content">

所以我把这个例子放在链接下面，为了我的目的调整它，它起作用了。问题解决了。