問題タブ [font-awesome]

WebサイトのアイコンにFontAwesomeを使用しています。私はHTMLとCSSにかなり慣れていません。これをチェックボックスに使用しようとしていたのですが、チェックボックスを有効/無効にして適切なアイコンを表示する方法を見つけるのに苦労しました。

例えば; チェックボックスに以下のタグを使用しています。

チェックボックスが有効/無効になっているときにアイコンを変更するために、以下のjQueryを使用しています。

私はこれがそれがどのように使われるべきかという方法ではないと確信しています。使い方を教えてください。

今のところ; チェックボックスを使用したいのですが、チェックボックスをオン/オフにして、対応するアイコンを表示することを目標としています。チェックした場合：icon-check; チェックされていない：icon-check-empty

案内してください!!

Rails 3アプリでfont-awesomeを使用しており、開発モードではすべて問題ありませんが、Herokuにプッシュすると、Firefoxはアイコンのレンダリングに失敗し、代わりに次のように表示されます。

• Chromeは、開発と本番環境でアイコンを適切にレンダリングします
• これはFireFoxに影響します（IEは試していませんが）
• アプリはここにあります。誰かがこれが私のマシンで起こっているだけではないことを確認できれば幸いです（ローカルホストのキャッシュの問題を除外するのに役立ちます）。
• フォントやスタイルシートを含むすべてのアセットは、asset_syncgemを使用してS3でホストされます。

これが私がしたことです：

font-awesome.css.scssの上部に以下を追加しました：**

次に、これをapplication.rbに入れます。

最後に、4つのフォントファイルすべてをに配置しましたapp/assets/fonts。

ここで何が間違っているのか本当に知りたいです。

Font Awesomeを使用しようとしています：

http://fortawesome.github.com/Font-Awesome/

これらのフォント アイコンをいくつかの Rails プロジェクトで問題なく使用しましたが、何らかの理由で Shopify ストアで使用しようとするとレンダリングされません。

問題なく別の @font-face を使用していますが、何らかの理由でこの @font-face がレンダリングされません。

資産/私は持っています：

そして、正常に動作する別の font-face と同じように、 @font-face でそれらをロードします。assets/ にある私の stylesheet.css で

しかし、アイコンを使用しようとすると、ロードできないようです。これがShopifyで機能しない理由は何ですか? 小さな何かが欠けているような気がしますが、それを理解することはできません。

何が悪いのかわかりません。私はこれを正しくやっているようです。アプリケーションでFontAwesomeを使用しようとしていますが、フォントが表示されません。私はというフォルダを持っており、そのfonts中にapplication.rb次の行が含まれています。

そして、Font-Awesomeに付属する2つのcssファイル（以下を参照）（IE7のものは必要ありません）の代わりに、メインのcssを自分の中に入れましたapplication.css。フォントファイルを検出するためにURLを変更するよりも。

サーバーの電源を切り、コードを変更するたびに再起動しましたが、それでもうまくいきませんでした。私は何が欠けていますか？

アップデート：

SASSまたはLESSを使用していません。多分それ@font-faceが問題ですか？私はこれまでこのタイプのコードの使用を見たことがありません。

アップデート

現在、font-awesome.cssファイルを使用しています。しかし、それは私のソースコードには表示されません。

完全な答え

これが、Font-Awesomeを正常に挿入する方法です。

引用元：https ： //gist.github.com/2251151

私はRoots WordPress テーマを使用していますが、Bootstrap が有効なサイトでもプロセスは同じであると確信しています。

組み込みの Twitter Bootstrap アイコンを無効にして、代わりに Font Awesome を使用したいと思います。Font Awesome を読み込んで動作していますが、一部のアイコンicon-envelopeは両方のセットからアイコンを読み込んでいるようです。

デフォルトの Twitter Bootstrap アイコンを無効にする方法はありますか?

changelog twitter-bootstrap-rails gemによると、 v.2.0.9 以降のfont awesomeがサポートされています。では、プロジェクトでこのサポートを有効にする方法は? デフォルトでは、Font Awesome アイコンは使用できません。

私はFont Awesomeアイコン フォントが大好きで、自分のサイトのほとんどのアイコンに使用したいと考えていますが、提供されているものに加えて必要なカスタム svg アイコンがいくつかあります。

Font Awesome の .svg バージョンは、主に次の<glyph />要素で構成されていることに気付きました。

私の svg アイコン コードを取得し、それを新しいグリフ要素として貼り付け、未使用の Unicode char を割り当てることは効果的でしょうか?

ブートストラップとフォントを使用したアイコンのこのメニューに問題があります。フォーマットが少なく、実行時にJavaScriptでコンパイルされています。

黒と青の両方が同時に登場！

コード：

ブラウザ出力：

同様の質問を検索しましたが、@font-face ルールが IE7 で機能しない理由についての解決策はまだ見つかりません。私のデモのライブリンクは次のとおりです。

http://www.staging.jungledragon.com/experiments/v3_02/

最新のブラウザーでこのサイトを開くと、グローバル ナビゲーションにナビゲーション ラベルを補足するアイコンがあることに気付くでしょう。これらのアイコンは、「FontAwesome」と呼ばれるフォントから取得されます。

多くの場所で推奨されているベスト プラクティスに従って、@font-face ルールを次のように宣言しています。

前述のように、IE7 では機能せず、フォントをまったくロードしていないようです。IE7 モードで IE9 を使用する Windows 7 と、ネイティブ IE7 を使用する XP マシンの両方でテストしました。また、フォント ファイルへの絶対パスを使用してみましたが、違いはありません。

デザイン全体でこれらのフォント アイコンを使用しているので、これを IE7 で動作させたいと思っています。何か案は？

font-awesomeには入力タイプ「submit」のクラスがないようです。font-awesomeのクラスをボタン入力に使用することは可能ですか？アプリケーションのすべてのボタン（実際にはtwitter-bootstrapのクラス「btn」にリンクしている）にアイコンを追加しましたが、「入力タイプの送信」にアイコンを追加できません。

または、このコードの使用方法：

html：

（HTMLから取得したもの：テキストと画像を含む送信ボタンを作成する方法は？）font-awesome？