我正在嘗試顯示一些錯誤訊息，比如說
<div class="alert alert-danger alert-dismissible fade show col-12" role="alert">
This is an error
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
<div class="alert alert-danger alert-dismissible fade show col-12" role="alert">
This is an error
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
堆疊在螢屏的右下角，使用 HTML、CSS、Bootstrap 就像這樣右下角的訊息圖片
uj5u.com熱心網友回復：
您可以創建一個錯誤包裝器 div 并將其定位為絕對位置。例如。
.error-container{
position:absolute;
bottom:0;
right:20px;
}<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.0.2/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
<div class="error-container">
<div class="alert alert-danger alert-dismissible fade show " role="alert">
This is an error 1
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
<div class="alert alert-danger alert-dismissible fade show " role="alert">
This is an error 2
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
</div>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/net/484786.html
上一篇：Bootstrap5自動調整列寬