バッヂになるタグ
特定のタグをバッヂ風(?)に表示するスタイルのサンプル。
表示サンプル(画像)
https://gyazo.com/f455b0e742d85681b254675eb30071ee
code:style.css
/* バッヂ風 */
display: inline-block; min-width: 3.2em; border-radius: .2em;
text-align: center; font: bolder 100%/normal Futura, Arial, sans-serif; color: #FFF } code:import.css
こんなのアイコン記法でやればいいじゃない? と思ったんだけど、アイコン記法よりタグのほうが楽だったり、ラベル幅を揃えるのもスタイルを変えるだけでよかったり、色替えできたり、そういう感じです。リンクもつながるしね!
2017-09-14 編集時と表示時でがたつきが少なくなるように調整
2017-11-28 スタイル定義をシンプルにした
2017-11-30 フォント名を指定するようにした
2018-03-27 タグリンクのhref値が変わったぽいので対応
2018-04-01 タグリンクのhref値が変わったぽいので対応
2022-03-19 タグリンクのhref値が変わったぽいので対応