小编Nam*_*kar的帖子

Bootstrap 5 模式不适用于入门模板

我正在尝试使用 Bootstrap 5 入门模板(我使用 Bootstrap Bundle with Popper 选项)来实现一个简单的模态,但由于某种原因,它不起作用。我已经解决了其他类似的问题,但不幸的是,没有一个对我有用。我想不通我哪里出错了。

我附上了简化的代码片段。我试图避免使用 javascript 来触发模态。我想使用 HTML data-* 属性来触发模式。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous"/>
    <title>Hello, world!</title>
  </head>
  <body>
    <div class="container">
      <h2>Basic Modal Example</h2>
      <!-- Trigger the modal with a button -->
      <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">
        Open Modal
      </button>
      <!-- Modal -->
      <div class="modal fade" id="myModal" role="dialog">
        <div class="modal-dialog">
          <!-- Modal content-->
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" …
Run Code Online (Sandbox Code Playgroud)

html bootstrap-modal bootstrap-5

1
推荐指数
1
解决办法
3407
查看次数

标签 统计

bootstrap-5 ×1

bootstrap-modal ×1

html ×1