web-dev-qa-db-ja.com

Bootstrapローカルを使用してグリフィコンがレンダリングされないBootstrap version

私はbootstrap in Djangoを使用しており、他のすべてのbootstrapクラスのアイコンクラスを除いて、class="glyphicon glyphicon-download-alt"

右下にエラーのあるスナップショット：

enter image description here

bootstrap.min.cssファイルが含まれている場合のスナップショット：

enter image description here

要素の検査を行うと、そのスナップショットはすべてのグリフィコンを含みます-

enter image description here

HTMLファイルでhttp://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.cssをリンクした場合にのみ機能します。 PCからbootstrap.min.cssを含めても機能しません。それ以外の場合は、すべてのbootstrapクラスが完全に機能します。私の問題を理解していただければ幸いです。よろしくお願いします。

csstwitter-bootstrap-3glyphicons
11
Rahul Satal

CDNリンクからCSSファイルを保存したため、機能しません。グリフィコンはそのCSSファイルに関連してリンクされているため、これは機能しません。例：

@font-face{
    font-family:'Glyphicons Halflings';
    src:url(../fonts/glyphicons-halflings-regular.eot);
}

つまり、ダウンロードされたBootstrapファイルは、フォルダー内のグリフィコンを探していますコンピューター上（これはありません）。

適切にダウンロードする必要がありますBootstrap from 公式ダウンロードリンク 。この公式ダウンロードには/fonts/実際のグリフィコンフォントファイルを含むディレクトリ。

または、CDNファイル内のすべてのフォントパスをCDN上のフォントへの絶対リンクに変更することもできますが、これは実際には意味がありません。

28
rnevius

最後に私の問題は解決されました。実際に問題は、DjangoなどのWebサイトでGlyphiconsを使用しているときに発生しました。 bootstrap official link からダウンロードしたbootstrap-3.3.2-distフォルダからフォントフォルダをコピーする必要もあります。

もう1つの問題は、それを修正する場所です。フォントがcssファイルを尊重するこの構造を参照し、フォントフォルダーを貼り付けます。

ブートストラップ/
├──less /
├──js /
├──fonts /
├──dist /
│├──css /
│├──js /
│└──fonts /
└──docs /
└──examples/

しかし、それは私のためにDjango静的フォルダ内で動作しました。

0
Rahul Satal