CSSでカスタムフォントを追加するには？

Question

私のローカルHTML Webサイトに自分のPC（WIN 10）からローカルフォントを追加する方法を知っている人がいるかどうかは疑問でした。ここで私はこれまでに試したことがあります。

@font-face { 
    font-family: bubble; 
    src: local(fonts/bubble.otf); 
} 

ここで私は、「フォント」ウィッヒは私のウェブサイトのフォルダ内に位置し、その後bubble.otfを選択し、それが

body { 
    margin:0; 
    font-family: bubble; 
} 

を動作しませんと呼ばれる私のフォルダからフォントを取りたいです

Answer 1

フォントがあなたのウェブサイトフォルダにある場合は、それがローカルフォントではないと考えるべきです。 は、ローカルにインストールされたフォントではなく、Webサイトがコンピュータにある場合でも、ウェブサイトの一部であるフォントではありません。

localの意味を誤解していると思います。通常のウェブフォントのように、localの代わりにurlを使用してフォントを読み込む必要があります。

Answer 2

ローカルディレクトリからフォントを呼び出す場合は、使用していたローカルの代わりに「url」を使用してフォントを呼び出す必要があります。以下は、達成したいものの実行可能な例です。あなたは、さまざまなフォントを使用したい場合は特に

@font-face { 
font-family: Segoel; 
src: url('../font/segoel.eot'); /* IE9 Compatibility Modes */ 
src: url('../font/segoel.eot?') format('eot'), /* IE6-IE8 */ 
url('../font/segoel.woff') format('woff'), /* Modern Browsers */ 
url('../font/segoel.ttf') format('truetype'), /* Safari, Android, iOS */ 
url('../font/segoel.svg#svgsegoel') format('svg'); /* Legacy iOS */ } 

しかし、fontsquirrelは直接、最も効果的な方法です、などGoogle fontなどのオンラインフォントリポジトリへのリンク。