1. ホーム
  2. html

[解決済み] Bootstrap 2 を使って、グリフィコンの色を青に変更する。

2022-03-04 14:34:49

質問

私はUIにBootstrapフレームワークを使用しています。グリフィコンの色を青に変えたいのですが、すべての場所ではないのです。場所によっては、デフォルトの色を使用する必要があります。

この2つのリンクを参照しましたが、何も役に立ちません。

注意:私は Bootstrap 2.3.2 .

解決するには?

ようやく自分でも答えが見つかりました。2.3.2ブートストラップで新しいアイコンを追加するには、以下のようにします。 素晴らしいフォント をファイルに入れてください。この後、色やサイズを変更するためにcssでスタイルをオーバーライドすることができます。

<link href="http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">

CSS

.brown{color:#9b846b}

アイコンの色を変えたい場合は、brown クラスを追加すれば、アイコンが茶色になります。また、様々な大きさのアイコンが用意されています。

HTML

<p><i class="icon-camera-retro icon-large brown"></i> icon-camera-retro</p> <!--brown class added-->
<p><i class="icon-camera-retro icon-2x"></i> icon-camera-retro</p>
<p><i class="icon-camera-retro icon-3x"></i> icon-camera-retro</p>
<p><i class="icon-camera-retro icon-4x"></i> icon-camera-retro</p>