Alerts와 Progress Bars

<div class="figure-img" data-ke-type="image" data-ke-style="alignCenter" data-ke-mobilestyle="widthOrigin"><img src="https://t1.daumcdn.net/cafeattach/1PqNJ/4ee2708eb6b26c4228b55c7c8643b9df7f913992" class="txc-image" data-img-src="https://t1.daumcdn.net/cafeattach/1PqNJ/4ee2708eb6b26c4228b55c7c8643b9df7f913992" data-origin-width="1641" data-origin-height="734"></div><div class="figure-img" data-ke-type="image" data-ke-style="alignCenter" data-ke-mobilestyle="widthOrigin"><img src="https://t1.daumcdn.net/cafeattach/1PqNJ/923161b891f6e620619f94f1de674b32f88b95aa" class="txc-image" data-img-src="https://t1.daumcdn.net/cafeattach/1PqNJ/923161b891f6e620619f94f1de674b32f88b95aa" data-origin-width="1641" data-origin-height="532"></div> <div class="figure-img" data-ke-type="image" data-ke-style="alignCenter" data-ke-mobilestyle="widthOrigin"><img src="https://t1.daumcdn.net/cafeattach/1PqNJ/39bdad87ba446f2cc974441807c92c74f98a8e44" class="txc-image" data-img-src="https://t1.daumcdn.net/cafeattach/1PqNJ/39bdad87ba446f2cc974441807c92c74f98a8e44" data-origin-width="1638" data-origin-height="427"></div><!DOCTYPE html><html lang="en">    <head>        <meta charset="UTF-8" />        <meta http-equiv="X-UA-Compatible" content="IE=edge" />        <meta name="viewport" content="width=device-width, initial-scale=1.0" />        <link rel="stylesheet" href="./assets/css/bootstrap.min.css" />        <title>Bootstrap Sandbox | Alerts & Progress Bars</title>    </head>    <body>        <div class="container">            <h1 class="mb-5">Alerts & Progress Bars</h1>                         <div class="alert alert-primary" role="alert">                This is a primary alert!            </div>            <div class="alert alert-secondary" role="alert">                This is a secondary alert!            </div>            <div class="alert alert-success" role="alert">                This is a success alert!            </div>            <div class="alert alert-danger" role="alert">                This is a danger alert!            </div>            <div class="alert alert-warning" role="alert">                This is a warning alert!            </div>            <div class="alert alert-info" role="alert">                This is a info alert!            </div>            <div class="alert alert-light" role="alert">                This is a light alert!            </div>            <div class="alert alert-dark" role="alert">                This is a dark alert!            </div>                                      <div class="alert alert-danger" role="alert">                This is a primary alert!                <a href="#" class="alert-link">Example link</a>            </div>                                      <div class="alert alert-success" role="alert">                <h4 class="alert-heading">Well Done</h4>                                    Lorem ipsum dolor sit amet consectetur, adipisicing elit.                    Amet, beatae.                                <hr />                Lorem ipsum dolor sit amet.            </div>                                      <div                class="alert alert-danger alert-dismissible fade show"                role="alert"            >                <button class="btn-close" data-bs-dismiss="alert"></button>                Something went wrong            </div>                                     <div                class="progress mb-4"                role="progressbar"                aria-valuenow="25"                aria-valuemin="0"                aria-valuemax="100"            >                <div class="progress-bar" style="width: 25%"></div>            </div>            <div                class="progress mb-4"                role="progressbar"                aria-valuenow="50"                aria-valuemin="0"                aria-valuemax="100"            >                <div class="progress-bar bg-success" style="width: 50%"></div>            </div>                                     <div                class="progress mb-4"                role="progressbar"                aria-valuenow="40"                aria-valuemin="0"                aria-valuemax="100"            >                <div class="progress-bar bg-danger" style="width: 40%">40%</div>            </div>                                      <div                class="progress mb-4"                role="progressbar"                aria-valuenow="50"                aria-valuemin="0"                aria-valuemax="100"            >                <div                    class="progress-bar progress-bar-striped bg-success"                    style="width: 50%"                ></div>            </div>                                     <div                class="progress mb-4"                role="progressbar"                aria-valuenow="50"                aria-valuemin="0"                aria-valuemax="100"            >                <div                    class="progress-bar progress-bar-striped progress-bar-animated bg-warning"                    style="width: 60%"                ></div>            </div>                                 </div>        <div style="margin-top: 350px"></div>         <script src="./assets/js/bootstrap.bundle.min.js"></script>    </body></html>