FC2ブログ

ラベルとバッジとアラート

ラベルをつけるなら
<p>
<span class="label">Note</span> Message
</p>

というようにする

また、このラベルには種類があり

label-warning にするとオレンジ色
label-info にすると水色になる

次にバッジ
スマホのメールの未読数字のように表示される

やり方は
<span class="badge">5</span>
というようにする

ちなみに、これも色を変えることができる
<span class="badge badge-important">5</span>
とすれば赤い色になる

ラベルとバッジに関しては
http://twitter.github.io/bootstrap/components.html#labels-badges
を参考にする

次はアラート

<div class="alert">
Message
</div>
とすることで、
Message というアラートができる

このアラートも
http://twitter.github.io/bootstrap/components.html#alerts
に詳しい解説が載っている

<div class="alert alert-success">
とすれば、アラートの背景色が緑になる

また、アラートとボタンの組み合わせもできる

<button type="button" class="close" data-dismiss="alert">×</button>

とすれば
アラートのところにxの消すボタンができるので
これを押せば、アラートが消える

あと、視覚効果でフワッと消すなら
<div class="alert alert-success fade in">
とすれば
ボタンと組み合わせることでふわっと消える
スポンサーサイト



コメント

非公開コメント

最新記事
検索フォーム
GREEハコニワ攻略サイト
リンク
カテゴリ
月別アーカイブ
フリーエリア
最新記事
FXプライムレート
最新コメント
最新トラックバック