2

HTML で Web サイトをデザインし、FontAwesome アイコンを使用しました。localhost で Web サイトを実行すると、アイコンが正常に表示されます。しかし、URLでは機能しません。ここにURL：デモ

ここに私のカスタムCSSがあります:

@font-face{
        font-family:'FontAwesome';
        src:url('../font/fontawesome-webfont.eot@v=3.2.1');
        src:url('../font/fontawesome-webfont.eot@#iefix&v=3.2.1') 
        format('embedded-opentype'),url('../font/fontawesome-webfont.woff@v=3.2.1') 
        format('woff'),url('../font/fontawesome-webfont.ttf@v=3.2.1') 
        format('truetype'),url('../font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') 
        format('svg');font-weight:normal;font-style:normal;
}

と

[class^="icon-"], [class*=" icon-"] {
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    text-decoration: inherit;
    -webkit-font-smoothing: antialiased;
}

と

.icon-envelope-alt:before{content:"\f003";}
.icon-heart:before{content:"\f004";}
.icon-star:before{content:"\f005";}
.icon-star-empty:before{content:"\f006";}
.icon-user:before{content:"\f007";}
.icon-film:before{content:"\f008";}
.icon-th-large:before{content:"\f009";}
.icon-th:before{content:"\f00a";}
.icon-th-list:before{content:"\f00b";}
.icon-ok:before{content:"\f00c";}
.icon-remove:before{content:"\f00d";}
.icon-zoom-in:before{content:"\f00e";}
.icon-zoom-out:before{content:"\f010";}
.icon-power-off:before,.icon-off:before{content:"\f011";}
.icon-signal:before{content:"\f012";}

誰でもこれを修正するのを手伝ってください。

ありがとうございます。

4

3 に答える 3

1

タグ head 内に FontAwesome のスタイルシートを含める必要があります

<head>
    ...
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
    ...

次に、メニューで次を使用します。

<span class="icon-angle-down" style="color: rgb(51, 51, 51);"></span>

正しいバージョンは次のとおりです。

<i class="fa fa-angle-down" style="color: rgb(51, 51, 51);"></span>
于 2015-12-10T12:08:56.787 に答える
0

パスにフォントが見つかりません: http://qubedns.co.in/codes/design/font/fontawesome-webfont.eot@v=3.2.1

このウェブページは利用できません

DNS_PROBE_FINISHED_NO_INTERNET

コードで使用しているパスはどれですか

@font-face{
        font-family:'FontAwesome';
        src:url('../font/fontawesome-webfont.eot@v=3.2.1');
        src:url('../font/fontawesome-webfont.eot@#iefix&v=3.2.1') 
        format('embedded-opentype'),url('../font/fontawesome-webfont.woff@v=3.2.1') 
        format('woff'),url('../font/fontawesome-webfont.ttf@v=3.2.1') 
        format('truetype'),url('../font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') 
        format('svg');font-weight:normal;font-style:normal;
}

ここに画像の説明を入力

于 2015-12-10T12:55:03.170 に答える