5

次のように、twitter ブートストラップを使用してホーム アイコンの色を非アクティブなテキストの色に一致させようとしています。

<div class="navbar navbar-fixed-top">
  <div class="navbar-inner">
    <div class="container">
      <ul class="nav">
        <li class="nav_item"><a href="indexdefaults.html"><i class="icon-home icon-gray"></i>Home</a></li>
        <li class="active"><a href="about.html">About</a></li>
      </ul>
    </div>
  </div>
</div>

しかし、「icon-gray」クラスは「nav_item」クラスのテキストよりもはるかに暗いです。nav_item テキストの色に一致する適切なクラス icon-foobar は何ですか?

4

3 に答える 3

10

カスタム スタイルを使用して灰色を取得できます。

.icon-gray {
  opacity: 0.3;
}

黒の重みに応じて、不透明度を低くまたは高く変更する必要がある場合があります。

于 2012-06-26T11:49:55.713 に答える
3

アイコンには白とダークの 2 つのバリエーションしかありません。別の色のアイコン セットを取得したい場合は、Photoshop で元のアイコンを変更するか、完全なアイコン セットを購入してソース ファイルを変更する必要があります。ありません.icon-gray。

于 2012-05-26T13:21:16.130 に答える
0

統合してみませんか: Font Awesome は、画像を編集せずに Bootstrap で正常に動作し、テキストの場合と同じようにアイコンの色を変更できます。

.icon-gray {color:#696969;}

素晴らしいフォント: http://fortawesome.github.io/Font-Awesome/

CSS マッチ カラーの検索: http://www.w3schools.com/cssref/css_colornames.asp

于 2013-05-16T17:05:19.407 に答える