HTML/CSSのカスタムフォントを使用

Question

私はMacでAtomエディタを使用していますが、問題があります。私は私のウェブサイトに "Typogrotesk"フォントを入れる必要があります。私はしばらくこのことをやろうとしていたが、運がなかった。私は私のCSSコードとしてこれを使用して試してみましたが、ない運：

h1 { 
font-family: "Typogrotesk"; 
font-size: 300%; 
color: white 

Answer 1

は、フォントフェースを作成していない：

@font-face { 
    font-family: 'Typogrotesk'; /*a name to be used later*/ 
    src: url('TheURLToTheFontFile'); /*URL to font*/ 
} 

その後、あなたのCSSスタイルでそれを使用する：

.example { 
    font-family: 'Typogrotesk'; 
} 

クレジットを：@Chris at this link

Answer 2

これは動作するはずです：

@font-face { 
    font-family: "Typogrotesk"; 
    src: url(yourfontfile); 
} 

これをCSSに入れてフォントをインポートします。他の場所でフォントを使用できるはずです。

これが機能しない場合は、yourfontfileを一重引用符または二重引用符で入力する必要があります。

Answer 3

は、ここからダウンロードしてください：http://www.dafont.com/de/typo-grotesk.font

はあなたのウェブスペース上のフォルダにアップロードします。 「スタイル/フォント」あなたは次のコードを追加するにはstyle.cssの上に

：たとえばその後

@font-face { 
    font-family: "Typogrotesk"; 
    src: url(fonts/typogrotesk.ttf); 
} 

を使用すると、単一の要素のためにそれを定義

.yourclass { 
font-family: 'Typogrotesk'; 
} 

かあなたはすべての要素のためにそれを定義します

* { 
font-family: 'Typogrotesk'; 
}