web-dev-qa-db-ja.com

Bootstrap 3.0.0のグリフィコンを使用するにはどうすればよいですか?

BootstrapでGlyphiconsを使用しています。 http://glyphicons.getbootstrap.com/css/bootstrap-glyphicons.css から直接CSSを呼び出していましたが、これは消えており、推奨されませんでした。

これは、TwitterがGlyphiconsをBootstrapパッケージで再び利用可能にすることと明らかに一致します。私はBootstrap 3.0.0 RC1またはRC2を使用しています。

私の問題:自分のホスティングでアイコンを使用する方法がわかりません...コードはbootstrap.css(?)に含まれているようです。 「fonts」ディレクトリをアップロードしましたが、適切なアイコンがあるはずの空の空のボックスアイコンしか表示されません。

何かアイデアはありますか?どこに、どのように呼び出す必要がありますか?

18
Robert Andrews

bootstrap-glyphicons.cssファイルはfinal\production Bootstrap 3.0.0で削除されたようです。単にZipを http://getbootstrap.com/ からダウンロードしてコピーしてください。 dist/css/bootstrap.min.cssファイルをcssフォルダーに。次に、HTMLページに次のように含める必要があります。

<!DOCTYPE html>
<html>
  <head>
    <title>Bootstrap 101 Glyphicons</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Bootstrap CSS file -->
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">

  </head>
  <body>

    <!-- Glyphicon in a H1 tag -->
    <h1>Hello, <span class="glyphicon glyphicon-globe"></span> !</h1>

  </body>
</html>

ソース: http://getbootstrap.com/getting-started/

10
David Lemayian

すでにフォントディレクトリに配置している場合、アイコンを呼び出すのは<span class="glyphicon glyphicon-pencil"></span> の代わりに <i class="icon-large icon-pencil"></i>

7
mrkre

フォントフォルダーが.cssファイルに対して正しく配置されていることを確認してください:../fonts

some-root-folder
├--my-css-folder
|  └--bootstrap.min.css
└--fonts
   └--glyphicons-halflings-regular.ttf
3
user3807820

この投稿をフォローしました http://www.erikminkel.com/2013/09/01/Twitter-bootstrap-3-in-a-Rails-4-application 。最善の方法かどうかはわかりませんが、動作します。