u-bg-(color)
背景に色をつける。オブジェクト・コンポーネントを可能な限り上書きする。
(color)は標準のカラーテーブルを参照。
.u-bg-third
は文字色が $body-color = $gray-strong
となる。
bg-gray
bg-first
bg-second
bg-third
bg-info
bg-important
<div class="u-bg-gray">bg-gray</div> <div class="u-bg-first">bg-first</div> <div class="u-bg-second">bg-second</div> <div class="u-bg-third">bg-third</div> <div class="u-bg-info">bg-info</div> <div class="u-bg-important">bg-important</div>
u-bg-fade
.u-bg-(color)
と併用すると背景色を薄くする。
bg-gray
bg-first
bg-second
bg-third
bg-info
bg-important
<div class="u-bg-gray u-bg-fade">bg-gray</div> <div class="u-bg-first u-bg-fade">bg-first</div> <div class="u-bg-second u-bg-fade">bg-second</div> <div class="u-bg-third u-bg-fade">bg-third</div> <div class="u-bg-info u-bg-fade">bg-info</div> <div class="u-bg-important u-bg-fade">bg-important</div>