2017-01-05 13 views
-4

私はちょうどウェブサイトの作成を始めます。 私はSymbolとTextフォントのためにあなたのフォントをすごくしたいです。 残念ながら、私はすべてをインポートしたものの、一部の部品は動作しません。 私はすべてのアイコンが働いていて、アニメーション化されたものでさえいいです。AwesomeFontはフォントを変更していません

私のPCにもフォントをインストールしましたが、実際のフォントを変更するブラウザはありません。私は

font-family: 'FontAwesome'; 

を入力すると それは単に何もしませんが、のTimes New Romanを使用しています。

私が見逃したことはありますか? はここで関連部分と私の実際の.cssと.htmlのです:

<head> 
    <meta charset="UTF-8"> 
    <title>foo</title> 
    <link rel="stylesheet" href="font-awesome-4.7.0\css\font-awesome.min.css"> 
    <link rel="stylesheet" href="design.css"> 
</head> 

、あなたは、関連するcssファイルをインクルードして持つ要素を使うべきフォント素晴らしいを使用するためには

body { 
    max-width: 600px; 
    margin: 50px auto 300px; 
    font-family: 'FontAwesome'; 
    font-size: 16px; 
    line-height: 1.2;  
} 
+3

hrefのスラッシュが間違っています。 –

+1

本文中のfontawesomeを 'font-family'として使うべきではありません。あなたはウェブサイトの「方法」を読んだことがありますか? – Dekel

+0

CSSファイルに必要なフォント驚くべきフォント宣言を含めましたか? – junkfoodjunkie

答えて

0

関連するクラス。ここ

は一例であり:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" /> 
 

 
<i class="fa fa-camera-retro"></i> fa-camera-retro

関連部分が<i class="fa fa-camera-retro"></i>ある - カメラアイコンの "コード" は、実際に<i>素子内部クラスfa-camera-retroあります。

アイコンの完全な一覧(および使用するクラスの名前)については、icon listをご覧ください。

1

実際、私は素晴らしいフォントが別のテキストスタイルを手に入れることができると考えて誤解を犯しました。それは@Scottがコメントの1つで言ったようにアイコンのためだ。

0

は、 "......とテキストフォントとして"

FontAwesomeはないは英数字のテキスト文字が含まれていません。あなたはテキストのためにそれを使用することはできません、記号/アイコンのためだけです。

さらに、実際のフォントファイル(.otf、.eot、.svg、.woff、.woff2)のcndリポジトリにリンクするか、それらをダウンロードしてサーバーにインストールする必要があります。

関連する問題