ラベル Material Design の投稿を表示しています。 すべての投稿を表示
ラベル Material Design の投稿を表示しています。 すべての投稿を表示

2016年7月9日土曜日

[Material Design Lite]バッヂについてまとめる。

目的

マテリアルデザインの「バッヂ」について、調べた結果をまとめる。

バッヂとは

状態を表すUIデザイン部分のこと。 iPhone等のスマートフォンでいうところの新着メールn件のnの部分。

バッヂまとめ

基本 Inbox
基本(白丸) Inbox
基本(オーバラップ) Inbox ※iconでない場合、spanタグでないとオーバラップしないよ
アイコン利用
account_box
アイコン利用(オーバラップ)
account_box
※material-icons利用時はdivタグ内がaccount_boxでないとダメ!
リンクバッヂ Inbox
リンクバッヂ(バッヂはリンクなし) Inbox ※「3」の部分はリンクになっていないよ。
データ多すぎ Inbox ※「456」と見える部分は実は「123456789」だよ。