背景色のクラス名
使い方:例
通常の背景色(原色)
基本設定されている背景の色の指定クラス名一覧です。
※-subtleは、(V5.3)から指定できます
class=”bg-primary”
class=”bg-primary-subtle”
class=”bg-secondary”
class=”bg-secondary-subtle”
class=”bg-success”
class=”bg-success-subtle”
class=”bg-danger”
class=”bg-danger-subtle”
class=”bg-warning”
class=”bg-warning-subtle”
class=”bg-info”
class=”bg-info-subtle”
class=”bg-light”
class=”bg-light-subtle”
class=”bg-dark”
class=”bg-dark-subtle”
class=”bg-body-secondary”
class=”bg-body-tertiary”
class=”bg-body”
class=”bg-black”
class=”bg-white”
class=”bg-transparent”
原色+グラデーション
.bg–gradient を追加することにより、線形グラデーションが上から背景画像として追加。
グラデーション/半透明の白から始まる
class=”bg-primary bg-gradient”
class=”bg-secondary bg-gradient”
class=”bg-success bg-gradient”
class=”bg-danger bg-gradient”
class=”bg-warning bg-gradient”
class=”bg-info bg-gradient”
class=”bg-light bg-gradient”
class=”bg-dark bg-gradient”
class=”bg-body bg-gradient”
class=”bg-white bg-gradient”
class=”bg-transparent bg-gradient”
アラート
アラートタグ「class=”alert”」と一緒に使用すると、角が丸くなり枠線が追加されるなど、
デザインが調整された状態になります。
アラート
class=”alert alert-primary”
class=”alert alert-secondary”
class=”alert alert-success”
class=”alert alert-danger”
class=”alert alert-warning”
class=”alert alert-info”
class=”alert alert-light”
class=”alert alert-dark”
一括指定されている、カラーコードはこちら↓
こちらもよろしく