今日、HTML に問題を発見しました。多くのデフォルト フォントが提供されていますが、「Bold」、「Song」、「Kai」などの中国語をサポートするフォントを除き、残りは中国語フォントを認識しません。お気に入りのフォントを使用する必要がある場合はどうすればよいのでしょうか。 CSS3 でカスタムダウンロードフォントを導入することは可能ですか?可能であれば、どのように導入すればよいでしょうか?この一連の問題に対する解決策を見てみましょう。効果を見るのが一番です。以下は、Web ページ上の 3 つのフォント「春節連句標準フォント」、「江南芸術フォント」、「毛浙東芸術フォント」の効果です。 Google Chrome: ファイアフォックス: 上記は効果のデモンストレーションですので、ご参考までに! まず、フォントをインポートする必要があります。このようなフォントが必要です (ユーザーには必要ありません)。フォントをダウンロードして、プロジェクトのフォント フォルダーに配置します。 フォントはオンラインまたはここからダウンロードできます。ダウンロードが完了したら、フォントを紹介します。 HTMLコード: <!DOCTYPE html> <html> <ヘッド> <メタ文字セット="UTF-8"> <title>フォントファイルテスト</title> </head> <本文> <div class="chunlian">春節連句標準フォントテスト</div> <div class="jiangnan">江南芸術フォントテスト</div> <div class="maozedong"> 毛沢東フォントテスト</div> </本文> </html> 次に、CSS スタイル設定を行います。 <スタイル タイプ="text/css"> @フォントフェイス { フォントファミリー:'chunlian'; src: url(font/chunlian.ttf); } @フォントフェイス { フォントファミリー: 'jiangnan'; src:url(font/jiangnan.ttf); } .chunlian{ フォントファミリー: 'chunlian'; フォントサイズ: 50px; テキストシャドウ: なし; } .江南{ フォントファミリー: 'jiangnan'; フォントサイズ: 40px; } @フォントフェイス { フォントファミリー: 'maozedong'; src:url(font/maozedong.ttf); } .maozedong{ フォントファミリー: 'maozedong'; フォントサイズ: 50px; テキストシャドウ: なし; } </スタイル> 他のフォントを追加したい場合は、CSS に @font-face と記述するだけです。 CSS3 で複数のカスタムフォントを導入する方法についての記事はこれで終わりです。CSS3 でカスタムフォントを導入する方法についての詳細は、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 |
<<: MySQL がデフォルト値を持つ NULL 列の使用を推奨しない理由
注意:この記事は現在取り組んでいる nestjs+graphql+serverless 合宿における...
プロジェクトで発生した不規則な絵画壁のレイアウト問題は、次のように分析されます。 1.img dis...
この記事はRHEL7.5でのMySQL 8.0.11のインストールチュートリアルを記録しています。具...
コンピュータ サイエンスで最も一般的に使用され、議論されているデータ構造の 1 つは、二分探索木です...
目次cgroupとはcgroupの構成cgroupが提供する機能cgroup 内の CPU を制限す...
Python バージョンを確認します (python -V)。2.7 未満の場合は、アップグレードす...
Apache Log4j2 が核レベルの脆弱性を報告し、スタックリーダーの友人たちは大騒ぎになりまし...
1. 公式紹介grep は Linux でよく使用されるコマンドです。これは、ファイルやテキストに対...
オンラインで多くの記事を検索しましたが、解決策は見つかりませんでした。次のように、tomcat7-m...
目次背景分析するデータシミュレーション1. 従業員テーブルと部門テーブルの2つのテーブルを作成します...
ウェブページとは何ですか? HTML ドキュメントがブラウザカーネルによってレンダリングされた後に表...
1. Navicatの紹介1. Navicat とは何ですか? Navicat は強力な MySQ...
目次vue - スワイパープラグインを使用してカルーセルを実装するカルーセルのバグを解決するには、w...
目次Oracle 分離レベルMySQL 分離レベル要約する多くの読者は、MySQL のトランザク...
Ubuntu 18のインストール中に、USBディスクからUbuntuのインストールを開始すると、mm...