Bootstrap 5 警告框
提醒框
Bootstrap 5 提供了一種簡單的方式來建立預定義的警告訊息
警告框使用 .alert 類建立，後跟一個上下文類 .alert-success, .alert-info, .alert-warning, .alert-danger, .alert-primary, .alert-secondary, .alert-light 或 .alert-dark
示例
<div class="alert alert-success">
<strong>Success!</strong> Indicates a successful or positive action.
</div>
自己動手試一試 »
警報連結
在警告框內的連結上新增 .alert-link 類，即可建立“顏色匹配的連結”
示例
<div class="alert alert-success">
<strong>成功！</strong> 您應該 <a href="#" class="alert-link">閱讀此訊息</a>。
</div>
自己動手試一試 »
關閉警報
成功！ 這個警告框可能表示一個成功或積極的操作。
要關閉警告訊息，請向警告容器新增 .alert-dismissible 類。然後為連結或按鈕元素新增 class="btn-close" 和 data-bs-dismiss="alert" （點選此元素，警告框將會消失）。
示例
<div class="alert alert-success alert-dismissible">
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
<strong>成功！</strong> 這個警告框可能表示一個成功或積極的操作。
</div>
自己動手試一試 »
動畫警報
使用 .fade 和 .show 類可以在關閉警告訊息時新增淡出效果
