ホームページ >ウェブフロントエンド >CSSチュートリアル >CSS の Web セーフ フォントとフォールバック フォントとは何ですか?

CSS の Web セーフ フォントとフォールバック フォントとは何ですか?

王林
王林転載
2023-08-25 23:33:121622ブラウズ

CSS 中的网络安全字体和后备字体是什么?

ウェブサイトは、企業、製品、サービスに関する情報をユーザーに提供することを目的として設計されています。どの Web サイトも、読者が反応できるように明確で美しい必要があります。 Web サイトのタイポグラフィーは、Web サイトに一貫性を持たせ、見た目の美しさを与える重要な要素です。 Web サイト全体の個性は、ブランド アイデンティティを作成する上で重要な タイポグラフィ によって構築されます。ユニークで一貫したタイポグラフィを使用すると、ユーザーは特定のフォントをあなたのブランドに関連付けるようになります。 優れたタイポグラフィを使用すると、読者の興味を維持し、Web サイトに長く留まるように説得できます。しっかりとしたグラフィックのバランスと強力な視覚的階層を生成することで、Web サイトの全体的なトーンを確立するのに役立ちます。意思決定の方法に影響を与え、読者がテキストの内容をどのように処理および解釈するかに大きな影響を与えます。コンテンツが魅力的なものとなり、Web サイトの読みやすさに影響を与えます。

Google が開発者向けに導入したさまざまな Web セーフ フォントを通じて、次のことができます。 ダウンロードは無料です。この記事では、Web セーフ フォントとフォールバック フォントについて説明します。

CSS によって提供されるフォントは開発者が利用できます。

Web セーフ フォントとは何ですか?

Web セーフ フォント

は、あらゆるデバイス上のすべてのブラウザでサポートされているフォントです。これらのフォントを使用すると、ユーザーのデバイスにフォントがインストールされていない場合でも、開発者はフォントを適切に表示できます。 Web セーフ フォントが開発される前は、フォントがユーザーのローカル システムにインストールされていない場合、ブラウザには Times New Roman

などの汎用フォントが表示されていました。ただし、開発者はサーバー側でフォントが正しく表示されているかどうかを検出できません。これにより、ユーザー エクスペリエンスが低下します。

Web セーフ フォントを使用すると、この問題は解決されます。Web デザイン中に Web セーフ フォントを使用すると、フォントがすべてのデバイスでそのまま表示されるので安心です。 ###文法### リーリー

Webセーフフォントの種類

Web セーフ フォントは 6 つあります。それらは次のとおりです-

Serif
  • - これらのフォントには、各文字の本文に小さな突起が含まれており、画面や印刷されたフォーム上で読みやすくなっています。セリフ フォント。

    等幅
  • - これらのフォントは、文字間の間隔が等しいフォントです。 Space Mono、Courier、Inconsolata などはすべて固定幅フォントです。

    サンセリフ フォント
  • - これらのフォントはセリフ フォントの逆です。小さな突起はありません。サンセリフ フォントの例としては、Arial、Helvetica、Futura、Calibri などが挙げられます。

    ファンタジー
  • - これらのフォントは高度に様式化され、装飾的です。 Papyrus、Herculanum、Luminari はファンタジーなフォントです。

    MS
  • - これらは Microsoft によって導入されたフォントです。Trebuchet MS、MS Gothic、Georgia などは MS フォントです。

    筆記体
  • - これらのフォントは筆記体に似ています。 Brush Script MT、Broadley、Monarda、Raksana などはいくつかの筆記体フォントです。

    ###例### リーリー CSS のフォールバック フォントとは何ですか?

    CSS は、Web デザイン用に 2 種類のフォント ファミリを提供します。これらは、セリフ (Times New Roman、Georgia など) などの汎用フォント ファミリと、Arial、Calibri などの個別のフォント ファミリです。
  • 一般的なフォント ファミリには、似たような外観のフォントが多数あるため、ユーザーのシステムでプライマリ フォントが利用できない場合は、類似したフォント ファミリのリストを含む
フォールバック

メカニズムが用意されています。代わりに使用されます。これらのフォントは代替フォントと呼ばれます。 100% 安全な Web フォントはないため、Web デザインのバックアップとして使用されます。エラーの可能性は常にあります。

バックアップ

フォントはバックアップとして機能することでこの問題を解決します。 Web セーフ フォントであるフォント ファミリをフォールバック フォントとして設定することもできます。

代替

フォントの例には、筆記体、ファンタジー、等幅フォントなどが含まれます。

###文法### リーリー

Font2、font3、font4 は、バックアップとして使用されるフォールバック フォントです。ブラウザが font1 をサポートしていない場合は、font2 が表示されます。font2 をサポートしていない場合は、font3 が使用されます。 ###例### リーリー 上記の例では、テキストのフォント ファミリは font1 です。ブラウザが font1 フォント ファミリをサポートしていない場合は、その横にフォールバック フォントとして使用できるフォント ファミリのリストが表示されます。 ###結論### Web デザインで Web セーフ フォントを使用することは、開発者がユーザーのデバイスに確実に表示されるようにするため、推奨されます。ただし、Web セーフ フォントは 100% 信頼できるわけではありません。したがって、CSS フォールバック フォントをフォントのバックアップとして使用して、あるフォント ファミリが機能しない場合に、ブラウザがリストされている別のフォント ファミリを試すことができるようにすることができます。共通のフォント ファミリを最初のフォントとして使用し、その後、他のオプションにも同じフォント ファミリを使用することをお勧めします。

以上がCSS の Web セーフ フォントとフォールバック フォントとは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はtutorialspoint.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。