[解決済み] Bootstrap 3 Glyphicons CDN
質問
<ブロッククオート注目!
Bootstrapのアイコンが帰ってきた 後 このプルリクエストのマージ .
ここ数週間、この件で何度も行き来した結果、私は Glyphiconsアイコンフォントをメインレポに戻しました。 . UIにおけるアイコンの普及率を考えると、CSSやJSと同じ場所にアイコン(または他のアイコンフォント)を入れないのは、おそらく多くの人にとって不利益なことです。
このアップデートにより、以下のようになりました。
- ドキュメントの復元 (コンポーネント ページ)
-
新しい変数を追加しました。
@icon-font-path
と@icon-font-name
アイコンフォントの追加や削除を柔軟に行うことができます。 - 最新のGlyphiconsへのアップグレード(40個の新規アイコンを追加)
- を削除しました。 CSSページからの古いGlyphiconsの言及
今後、アイコンフォントのカスタマイズを改善し、フォントライブラリの交換をより簡単に行えるようにします(これが、当初の削除の動機でした)。
Twitter Bootstrap Glyphiconsの新バージョンのCDN URLはどれですか?
Bootstrap 3より 別のレポジトリに移動されました。 しかし、CDNは見つかりませんでした。
公式ドキュメントより。
Bootstrap 3のリリースに伴い、アイコンは別のリポジトリに移動しました。これにより、主要なプロジェクトはできるだけ整理され、アイコンライブラリの交換が容易になり、GlyphiconsアイコンフォントがBootstrap以外のより多くの人々にも容易に利用できるようになりました。
について 公式サイト アイコンのCDN URLを提供していない。
どこにあるのでしょうか?レポジトリをダウンロードして、プロジェクトに組み込むのは嫌です。
解決方法は?
最近の
のリリースは、ブートストラップ 3
そして、グリフィコンはメインのBootstrapレポにマージされました。
ブートストラップCDN
は、現在
グリフィコンを含むBootstrap 3.0の完全なcssです。
. Bootstrap cssのリファレンスは、インクルードするのに必要なものだけです。Glyphiconsとその依存関係は、CDNサイト上の相対パス上にあり、以下の場所で参照されます。
bootstrap.min.css
.
htmlの場合。
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet">
cssで。
@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css");
以下は、動作中の デモ .
備考
を使用しなければならないこと。
.glyphicon
クラスの代わりに
.icon
:
例
<span class="glyphicon glyphicon-heart"></span>
また、次のことにも注意してください。
を含める必要があります。
bootstrap.min.js
BootstrapのJavaScriptコンポーネントの使用法については
ブートストラップCDN
をご覧ください。
グリフィコンを個別に使用したい場合 で、GlyphiconsのCSSを直接参照することで実現できます。 ブートストラップCDN .
htmlの場合。
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">
cssで。
@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css");
というのは
css
ファイルには、すでに必要なすべてのGlyphiconsの依存関係(Bootstrap CDNサイトの相対パスにある)が含まれているので、このファイルに
css
というファイルを作成するだけで、Glyphiconsを使い始めることができます。
以下は、動作中の デモ Bootstrapを使用しないGlyphiconsの。
関連
-
[解決済み] ボディの背景色が表示されない?
-
[解決済み] <html xmlns="http://www.w3.org/1999/xhtml">」は何をするのですか?
-
[解決済み] ionic 4でion-buttonをセンタリングする方法は?[重複しています]
-
[解決済み] Railsアプリケーションにアイコンを追加する
-
[解決済み] Bootstrap 3 Glyphiconsが動作しない
-
[解決済み] Twitter Bootstrapのメニューをクリックではなく、ホバーでドロップダウンさせる方法
-
[解決済み] Twitter Bootstrap 3を使用して列を中央に配置する
-
[解決済み] Bootstrapの列をすべて同じ高さにするにはどうしたらいいですか?
-
[解決済み] Bootstrap3による垂直方向の整列
-
[解決済み] Bootstrap 3 の sr-only とは何ですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン