問題タブ [font-awesome]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
918 参照

twitter-bootstrap - font awesome SVGファイルからSVGファイルを手動で作成するときに、fontcustomから適切なサイズと整列されたアイコンを作成できません

fontawesomeのsvgファイル(fontawesome-webfont.svg)からSVGファイルを抽出して、特定のフォントのみを使用し、fontcustomを使用して独自のカスタムフォントを作成できるようにしようとしています。これはすべて、fontawesomeの300ほどのアイコンをすべて使用しているわけではなく、ほんの一握りであるため、フォントファイルのサイズを小さくするためのものです。

既存のアイコンのSVGファイルを抽出するにはどうすればよいですか?私は多くの組み合わせを試しましたが、そのうちの1つは次のとおりです。

font-awesome.min.cssから、icon-calendarは次のようになっていることがわかります。

次に、fontawesome-webfont.svgから、d = "で始まるicon-calendarのグリフコードをコピーし、fontcustomで使用する新しいSVGファイル(パスのプレフィックスを付けることにより)calendar.svgを作成しました。

style = fill lineを含めないと、SVGはブラウザーでレンダリングされないため、fontcustomは空のTTFファイルを作成します。

ここまでは順調ですね。したがって、SVGファイルを手動で作成し、fontcustomスクリプトを実行してfontcustom.cssやその他のフォントファイルを生成することができます。ただし、この段階では複数の問題があります。

  1. 結果のアイコンのサイズは、fontawesomeを使用した場合と同じではありません。かなり大きいです。これは、私が見逃しているSVGで何かを指定することと関係があります。でもそもそもどこからコピーしたらいいのかわからない!

  2. 一部のアイコンは回転しています。たとえば、星のアイコンが少し回転します。

    .icon-star-empty:before {content: "\ f006"; }

手動で作成している個々のSVGファイルを含むものである必要があります。私は何が欠けていますか?それとも何か他にありますか?

0 投票する
1 に答える
807 参照

ruby-on-rails - フォントの素晴らしいsassレールの奇妙な異常

以下に示すように、私は明らかにuser-mdクラスでアイコンを使用しようとしましたが、これはどういうわけかubuntuアイコンとして表示されています。私は非常に混乱しています。

ここに画像の説明を入力してください

また、別の異常...Twitterのブートストラップで説明されているナビゲーションリストがあります... http://twitter.github.com/bootstrap/components.html#navs

何らかの理由で、アクティブなliは、目的のicon-homeの上にicon-glass..のオーバーレイを表示します。通常の李は家だけを示しています。

ここに画像の説明を入力してください

GNOME Shell3.6.2でubuntu12.10を使用していますが、gemfileロックファイルは次のとおりです。

0 投票する
1 に答える
3055 参照

ruby-on-rails - twitter-bootstrap を使用して「Font Awesome」をアプリに追加するにはどうすればよいですか?

重複の可能性:
Rails: Using Font Awesome

多くのtwitter-bootstrapのアイコンを使用しているRailsアプリがあります。

そのために、「boostrap.css.erb」を /assets/stylesheets/ フォルダーに直接配置し
、「glyphicons-halflings-white.png」と「glyphicons-halflings.png」を /assets/images/ フォルダーに直接配置しました。

今、Font awesome をダウンロードして解凍しました。
これらのファイルで何かをしなければならないと思います。誰か設定方法教えてくれませんか?

/css/ フォルダー

  • font-awesome-ie7.min.css
  • font-awesome.css
  • font-awesome.min.css

/font/ フォルダ

  • fontawesome-webfont.eot
  • fontawesome-webfont.svg
  • fontawesome-webfont.ttf
  • fontawesome-webfont.woff
  • FontAwesome.otf
0 投票する
21 に答える
631944 参照

html - Font Awesomeのアイコンの色を変更できますか?

<a>何らかの理由でアイコンをタグで囲む必要があります。
フォント素晴らしいアイコンの色を黒に変更する方法はありますか?それとも、タグ
で包まれている限り不可能ですか?<a>Font awesomeは、画像ではなくフォントであるはずですよね?

ここに画像の説明を入力してください

0 投票する
1 に答える
1376 参照

ruby-on-rails-3 - FontawesomeアイコンはIE8とChromeでは表示されません(Windowsのみ)

作成しているRailsアプリで問題が発生しています。fontawesomeを使用していくつかのアイコンをレンダリングしています。railsアプリはHerokuで実行されています。

問題は、Chrome / WinおよびIE8では、アイコンがレンダリングされないことです。ボックスなし-何もありません。これらはIE9、Firefox / Winでレンダリングされ、OSXのすべてのブラウザーでレンダリングされます。

私は私の中に次のものを持っていますapplication.rb

フォントファイルはassets/fontディレクトリにあり、SCSSファイルには次のものがあります。

誰かが同様の問題に遭遇しましたか?(私が読んだほとんどの投稿は、問題ではないボックスを表示するか、Firefoxでフォントが機能しないという問題を中心に展開しています。)

0 投票する
1 に答える
6563 参照

css - Fontawesome が読み込まれない

私は現在、プロジェクトで Fotawesome を使用しています。問題は、Web ページをロードすると、アイコンではなくブロックしか表示されないことです。フォントは「サーバー上で見つかりません」ですが、正しい場所にあることは確かです (自分でファイルを参照できます)。localhost で Web ページを読み込むと、すべて正常に動作します。Fontawesome がコンピューターにインストールされていません。それはMIMEタイプと関係があるのでしょうか?これを修正するにはどうすればよいですか? (Apacheサーバーを使用しています)

0 投票する
2 に答える
7206 参照

css - Font-Awesome アイコンが Chrome for Android で正しく表示されない

Android 版 Chrome の次のページで、My Font-Awesome アイコンが正しくレンダリングされません。

http://nylen.tv/public/chrome-issue.html

td.description要素 (ZZZZZ 行) の最後には、1 つまたは 2 つの Font-Awesome アイコンがあります。私の Galaxy Nexus では、ページが縦向きモードで読み込まれている場合、これらは表示されません。ページが横向きモードで読み込まれている場合は表示されますが、電話を縦向きモードにすると消えます。Nexus 7 でも同様の問題が発生します。

マークアップに問題はないと思います。私が試した他のすべてのブラウザで動作し、HTML と CSS は、Font-Awesome のベンダー プレフィックス付きの CSS プロパティを除いて検証されます。

誰もこのようなものを見たことがありますか?回避策はありますか?

0 投票する
1 に答える
1769 参照

ruby-on-rails - フォームビルダーで送信ボタンの値を取得するには?

simple_formRails 3.2 で gem を使用してフォームを作成しています。

私が抱えている問題は、フォームfont-awesomeの行にアイコンを追加したいということです。f.button :submit出力はタイプであるためinput、アイコン要素をその中に埋め込むことはできません。

submitアイコンを含むフォームにボタンをハードコーディングするだけで済みますが、ボタンの値を取得する方法がわかりません - Create %model/ Update %model

私のコードは以下に掲載されています:

期待される出力:

または、コントローラーのアクションに応じてModelNameを更新します。

0 投票する
1 に答える
1017 参照

css - フォント-IE9とIE8では素晴らしいアイコンが奇妙に見える

私は自分のサイトのアイコン/ボタンにfont-awesomeライブラリを使用しています。

ブートストラップを使用せず、直接接続するだけです。

IE9とIE8では、アイコンが2倍になり、それが私を困惑させています。

誰もがこれが何であるか知っていますか?

ここに画像の説明を入力してください

0 投票する
1 に答える
3431 参照

css - アコーディオンにフォントアイコンを追加する方法-zurbfoundation

私はZurbFoundationを使用して、アコーディオンに取り組んでいます。Zurbアコーディオンには、トグルとして機能するCSS三角形が付属していますが、liにアクティブなクラスがあるかどうかに応じて、代わりに2つのfont-awesomeアイコンを使用したいと思います。現在、アイコン画像のプレースホルダーを取得しています。

可能であれば、CSSのみでこれを行うことをお勧めします。

これが私のCSSです:

HTMLは次のとおりです。