複数記事に分けてWEB制作でよく使うBootstrapの機能や意外と知られていない便利な機能なども紹介していきますので、初めてBootstrapにチャレンジされる方も、既にBootstrapを使って開発をされている方にも読んでいただけると嬉しいです。第6回目の今回は「バッジ編」!Bootstrap4でバッジを設定する方法を解説していきたいと思います。バッジBootstrap4では、クラスを付与することで、バッジを設定することができます。基本のルールについてspan要素に「badge」クラスと、「badge-xx」のクラスを付与して使います。「badge」クラスに加え、「badge-xx」のクラスを付与することでバッジの色を変更することができます。「badge」クラスに、「badge-pill」を同時に付与することでより丸いバッジを設定することができます。">Primary</span>リンクバッジの設定a要素に「.badge」クラスを付与すると、バッジにリンクを付けることができます。href="#">Primary</a>まとめ今回はバッジ編ということで、様々なカラーバッジの設定方法をご紹介しました。社員Aフロントエンドエンジニア・デザイナーの社員Aです。更新頻度が多いかと思います。このブログのテーマも作成しました。ブログの執筆を通じて、やっと日本語Lv.20くらいになれた気がします。株式会社ユニバースです。ホームページデザイン、ECサイトデザインなどWEB制作のトータルサポートを行っております。ホームページ制作やネットショップ運営代行などwebに関するご相談・お見積は、お気軽にお問い合わせください。MAX】2018年10月19日10今話題のLINEのオープンチャットとは?実際に参加してみた2019年09月11。