alert-link
bootstrap5.css
bootstrap5.css
.alert-link {
font-weight: 700;
}
bootstrap5.css
.alert-primary .alert-link {
color: #002752;
}
bootstrap5.css
.alert-secondary .alert-link {
color: #202326;
}
bootstrap5.css
.alert-success .alert-link {
color: #0b2e13;
}
bootstrap5.css
.alert-info .alert-link {
color: #062c33;
}
bootstrap5.css
.alert-warning .alert-link {
color: #533f03;
}
bootstrap5.css
.alert-danger .alert-link {
color: #491217;
}
bootstrap5.css
.alert-light .alert-link {
color: #686868;
}
bootstrap5.css
.alert-dark .alert-link {
color: #040505;
}
html bootstrap5 Sample
アラート内にコンテンツを追加する:alert
<div class="alert alert-success" role="alert">
<h4 class="alert-heading">アラートのタイトル</h4>
<p>アラートの内容</p>
<p class="mb-0"><a href="#" class="alert-link">詳細内容へ</a></p>
<p class="mb-0"><a href="#">問い合わせ</a></p>
</div>