menu search
person
thumb_up_alt 0 интересует thumb_down_alt 0 не интересует

1 Ответ

Например, так:

<!doctype html>

<html lang="en">

  <head>

    <!-- Required meta tags -->

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->

<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>Модальное окно</title>

  </head>

  <body>

    <h1>Модальное окно</h1>

    

    

 <!-- Кнопка-триггер модального окна -->

<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">

  Открыть

</button>

<!-- Модальное окно -->

<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">

  <div class="modal-dialog">

    <div class="modal-content">

      <div class="modal-header">

        <h5 class="modal-title" id="exampleModalLabel">Заголовок модального окна</h5>

        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Закрыть"></button>

      </div>

      <div class="modal-body">

        <p>Модальное окно</p>

      </div>

      <div class="modal-footer">

        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>

        <button type="button" class="btn btn-primary"  onclick="alert('Сообщение!');">Сообщение</button>

      </div>

    </div>

  </div>

</div>

   

    <!-- Optional JavaScript -->

    <!-- jQuery first, then Popper.js, then Bootstrap JS -->

    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>

    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.bundle.min.js" integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf" crossorigin="anonymous"></script>        

  </body>

</html>

thumb_up_alt 1 ЗА thumb_down_alt 0 не интересует
Добро пожаловать на сайт: "Спроси программиста". Вы можете задавать вопросы по программированию и получать ответы от других членов сообщества. Проект школы программирования Progtips.

Категории

20 вопросов

22 ответов

8 комментариев

54 пользователей

Похожие вопросы

thumb_up_alt 0 интересует thumb_down_alt 0 не интересует
1 ответ
thumb_up_alt 0 интересует thumb_down_alt 0 не интересует
1 ответ
thumb_up_alt 0 интересует thumb_down_alt 0 не интересует
1 ответ
thumb_up_alt 0 интересует thumb_down_alt 0 не интересует
1 ответ
thumb_up_alt 0 интересует thumb_down_alt 0 не интересует
1 ответ
...