Ubuntuで読み込んだフォントではなくシステムフォントが適用されてしまう

Question

実現したいこと

cssファイルで設定しているフォントがの優先度を一番高く設定したい

前提

Ubuntu 20.04.5 LTS

発生している問題・エラーメッセージ

CSSで設定しているが、Notosansが当たってしまいデザイン確認ができない

Comments

[maisumakun]

使用中のブラウザ、その設定、書いてみたソースコードについてご提示ください。

Answer 1

CSSファイルで設定されたフォントが正しく表示されない原因はいくつかあります。以下に、問題の原因とその解決策をいくつか示します。

フォントのパスが正しくない: CSSファイルで指定されたフォントファイルへのパスが正しいかどうかを確認してください。パスが正しくなければ、ブラウザはフォントを読み込むことができません。

フォントファイルが存在しない、またはアクセス不可能: フォントファイルが存在しない、またはウェブサーバーによってアクセスが制限されている可能性があります。ファイルが存在し、アクセス可能であることを確認してください。

ブラウザのキャッシュ: ブラウザのキャッシュが原因で古いフォントが適用されることがあります。ブラウザのキャッシュをクリアし、ページを再読み込みしてみてください。

CSSの優先度: CSSのセレクタの特異性が低い場合、他のCSSルールによって上書きされる可能性があります。その場合、より特異的なセレクタを使用するか、!importantキーワードを使用してフォントスタイルを強制することができます。

ブラウザのデフォルト設定: ブラウザがデフォルトで設定されているフォントが適用されている可能性があります。これを解決するには、明示的にフォントを指定するCSSルールを追加する必要があります。

フォント形式の問題: 使用しているフォントの形式がブラウザによってサポートされていない可能性があります。これを解決するには、サポートされているフォント形式を使用するか、複数のフォント形式を提供することが必要です。

これらのポイントを確認してみてください。それでも問題が解決しない場合は、問題の詳細（使用しているブラウザ、具体的なCSSコードなど）を教えていただければ、より具体的な解決策を提案することができます。