javascript - Bootstrap 模式不适用于示例代码

标签 javascript html css twitter-bootstrap modal-dialog

我使用了bootstrap的示例代码,我使用了2个css文件和1个js文件。

代码如下:

<html>
<head>
    <title></title>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">

    <!-- Latest compiled and minified JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>

<body>
    <!-- Small modal -->
    <button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-sm">Small modal</button>

    <div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                ...
            </div>
        </div>
    </div>
</body>
<html>

我不知道我做错了什么我只是想让它显示我想要的模态。

最佳答案

使用这个

HTML

<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="utf-8" />
    <title>Bootstrap, from Twitter</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <!-- Le styles -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" />
    <link href="style.css" rel="stylesheet" />

    <script src="script.js"></script>
  </head>

  <body>

     <!-- Small modal -->
    <button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-sm">Small modal</button>

    <div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                Hello World
            </div>
        </div>
    </div>


    <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
  </body>

</html>

关于javascript - Bootstrap 模式不适用于示例代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32435926/

相关文章:

javascript - CSS3 translate3d 的 JS 框架,动画支持

CSS 溢出 : hidden

javascript - 如何防止恶意代码调用我的 javascript

html - CSS 高度 100% + 溢出 : auto not showing all of nest content

html - CSS 或 HTML 规范中是否定义了 block 元素和内联元素?

javascript - 可以通过从 Javascript 中的字符串加载 HTML 来创建自定义 "DOMs"吗?

html - 像 XDT 转换一样转换 HTML

javascript - Dojo:如何禁用 dijit.form.FilteringSelect 选项

javascript - onclick 事件未在 firefox 4.1 中的 anchor 标记中触发

javascript - 转换为 ObjectId 失败 : Mean Stack