2016-05-12 3 views
0

こんにちは:)私のウェブページでウェブフォントを使用する際に問題があります。スタイルシートとHTMLファイルは別のフォルダにあります。このようにして、すべてのCSSコードはフォント1を除いて動作します。スタイルシートをhtmlページのフォルダに移動すると、フォントが変更されます。 誰かがなぜこれが起こっているのか説明できますか?私のウェブページのフォントを変更

動作しない場合のHTMLコード:

<!DOCTYPE html> 

<html lang="it"> 
    <head> 
     <meta charset="utf-8"> 
     <link rel="stylesheet" href="css/style.css"> 
    </head> 

    <body> 
     <h1>example1</h1> 
     <p>example2</p> 
    </body> 
</html> 

作業ケースでHTMLコード:

<!DOCTYPE html> 

<html lang="it"> 
    <head> 
     <meta charset="utf-8"> 
     <link rel="stylesheet" href="style.css"> 
    </head> 

    <body> 
     <h1>example1</h1> 
     <p>example2</p> 
    </body> 
</html> 

CSSコード(それは、それぞれの場合に同じです):

@font-face { 
    font-family: 'Raleway'; 
    src: url('other/font/Raleway-ExtraLight.eot'); 
    src: url('other/font/Raleway-ExtraLight.woff2') format('woff2'), 
     url('other/font/Raleway-ExtraLight.woff') format('woff'), 
     url('other/font/Raleway-ExtraLight.ttf') format('truetype'), 
     url('other/font/Raleway-ExtraLight.svg#Raleway-ExtraLight') format('svg'), 
     url('other/font/Raleway-ExtraLight.eot?#iefix') format('embedded-opentype'); 
    font-weight: normal; 
    font-style: normal; 
} 

body { 
    font-family: Raleway; 
} 

答えて

2

CSSのURLは、のCSSファイルのURLを基準にしたものであり、HTMLのドキュメントではありませんnt。

CSSファイルを移動すると、other/font/Raleway-ExtraLight.eotなどが計算されるディレクトリが変更されます。

/css/other/font/Raleway-ExtraLight.eot`

おそらく/をURLの先頭に置きたいと思っているかもしれません。

+0

ありがとうございました!私がコードを書いたとき、私は少し不在でした。私はその愚かなエラーに気付かなかった:/ – Bananasaurus

0

CSSファイルのフォントURLは、HTMLファイルではなく、CSSファイルの場所を基準にしています。現在のURL、'other/font/Raleway-ExtraLight.eot''[Your CSS folder]/other/font/Raleway-ExtraLight.eot'と同じです。

あなたのCSSやフォントは、この構造では、異なるフォルダにある場合:

-css 
    -styles.css 
-fonts 
    -Raleway.eot 

、フォントへのURLが'../fonts/Raleway.eot'(レベルアップ..移動)する必要があります。

関連する問題