什么 bootstrap 库需要使用 modal-body？

Question

我有以下 HTML，但它不呈现 bootstrap 模态对话框。我是否需要 Bootstrap 的其他版本？

<link href="https://cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.7.0/css/mdb.min.css" rel="stylesheet">

<div class="modal-body">
  <div style="text-align: center">
    <i class="fas fa-check fa-4x mb-3 animated rotateIn"></i>
    <h5>#if(campaign.creatorID == "FE4E6920-A920-4AEB-8977-60BF51EC1CE7"){Merci de coller le texte après avoir continué.}else if(campaign.creatorID == "0B4DC579-EB0E-47E9-B5C2-F2EB3B1BFFC7"){Plak de tekst na het doorgaan.}else{#if(whitelabel.pleasePasteAfterContinuing){#(whitelabel.pleasePasteAfterContinuing)}else{Please paste the text after continuing.}}<br/></h5>
  </div>
</div>

Answer 1

自从 bootstrap 4.0 版本模态主体在模态 class 内部使用。 https://mdbootstrap.com/docs/standard/components/modal/

另外还需要添加js文件

Answer 2

访问以下linkIntroduction - Bootstrap.

甚至不需要向下滚动，您就会看到所需的 Bootstrap 脚本和样式表。

确保在您的 <head></head> 脚本之前引用样式表！

<!DOCTYPE html>
<html>
  <head>
  
  <!--Stylesheets-->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    
    <!--Scripts-->
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

  </head>
  
  <body>
  
  </body>
</html>

见Modal - Bootstrap

Answer 3

只有 CSS 个文件无法正常工作。您还必须添加 Javascript 文件才能执行所有功能。

Answer 4

将样式表复制粘贴到您之前的所有其他样式表中，以加载我们的 CSS。

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

我们的许多组件需要使用 JavaScript 才能运行。具体来说，它们需要 jQuery 和我们自己的 JavaScript 插件。将以下 s 放在页面末尾附近，就在结束标记之前，以启用它们。 jQuery 必须先来，然后是我们的 JavaScript 插件。

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>

希望对您有所帮助

什么 bootstrap 库需要使用 modal-body？

What bootstrap library need to use modal-body?

html

css

bootstrap-modal