utility-bg

echo-bg-(color)

背景に色をつける。
オブジェクト・コンポーネントを可能な限り上書きし、内包するテキストリンクの文字色も変更するが、 :hover, :focus 等のステートがあるオブジェクトには対応していない。
(color)は標準のカラーテーブルを参照。

bg-default
bg-info
bg-important
bg-inverse
<div class="echo-bg-default">bg-default</div>
<div class="echo-bg-info">bg-info</div>
<div class="echo-bg-important">bg-important</div>
<div class="echo-bg-default echo-padding-sm"><div class="echo-bg-inverse">bg-inverse</div></div>

sub class echo-bg-fade

.echo-bg-(color) と併用すると背景色を薄くする。

bg-default
bg-info
bg-important
bg-inverse
<div class="echo-bg-default echo-bg-fade">bg-default</div>
<div class="echo-bg-info echo-bg-fade">bg-info</div>
<div class="echo-bg-important echo-bg-fade">bg-important</div>
<div class="echo-bg-default echo-padding-sm"><div class="echo-bg-inverse echo-bg-fade">bg-inverse</div></div>