Font AwesomeをCSSのcontentプロパティで使用する

このサイトでもアイコンとして利用しているFont Awesome

通常Font Awesomei要素を追加しますが、CSSのcontentプロパティに記述することでHTMLを変更することなく使用できます。

例:Bootstrap 3 のパンくずで、/を右矢印 に変更する

Unicodeは F105

icon-angle-right

.breadcrumb > li + li:before {
    content: "\f105";
    font-family: FontAwesome;
}

簡単な記述で、ご覧のとおり

breadcrumb

Posted