ホームページ >ウェブフロントエンド >フロントエンドQ&A >HTMLでフォントを設定するための属性は何ですか?

HTMLでフォントを設定するための属性は何ですか?

青灯夜游
青灯夜游オリジナル
2021-06-08 17:30:3510745ブラウズ

HTML でフォント属性を設定します: font、font-family、font-size、font-style、font-variant、font-weight、"@font-face"、font-size-adjust、font-ストレッチ。

HTMLでフォントを設定するための属性は何ですか?

このチュートリアルの動作環境: Windows 7 システム、CSS3&HTML5 バージョン、Dell G3 コンピューター。

フォント プロパティは、フォント、太字、サイズ、テキスト スタイルを定義します。

HTML でフォント属性を設定します

Attributes Description
font すべてのフォント プロパティを 1 つの宣言で設定します
font-family テキストのフォント ファミリーを指定します
font-size テキストのフォント サイズを指定します
font-style テキストのフォント スタイルを指定しますtext
font-variant テキストのフォント スタイルを指定します。テキストを表示するためにスモールキャップフォントを設定すると、すべての小文字が大文字に変換されますが、スモールキャップを使用するすべての文字のフォントサイズは、テキストの残りの部分に比べて小さくなります。
font-weight フォントの太さを指定します
@font-face Aルール、Web サイトが「Web セーフ」フォント以外のフォントをダウンロードして使用できるようにする
font-size-adjust 要素のアスペクト値を指定します。優先フォントの x 高さが維持されるように、要素のアスペクト値を指定します。
font-stretch 現在のフォント ファミリを縮小または拡大します。現在のフォントファミリーを拡大縮小および変換します。すべての主要なブラウザでサポートされているわけではありません。

#拡張情報: #HTML/CSS には、次の 2 種類のフォント ファミリ名があります。

    ユニバーサル フォント ファミリ - 同様の外観を共有するフォント システムの組み合わせ (「Serif」や「Monospace」など)
  • 特定のフォント ファミリ - 特定のフォントファミリー (「Times」や「Courier」など)
汎用ファミリーSerifTimes New RomanサンセリフArialMonospaceCourier New font-family プロパティは、ブラウズする場合の「フォールバック」メカニズムとして複数のフォント名を設定する必要があります。最初のフォントはブラウザでサポートされていないため、次のフォントが試行されます。
フォント ファミリー 説明
Georgia
Serif フォント文字の行末 追加の装飾
Verdana
「Sans」はなしを意味します - これらのフォントには末尾に追加の装飾がありません
Lucida Console
すべての等幅文字は同じ幅を持ちます

注: フォント ファミリの名前が複数の文字である場合は、Font Family: "宋体" のように引用符で囲む必要があります。

複数のフォント ファミリは、カンマで区切って指定します。

p{font-family:"Times New Roman", Times, serif;}

次に、一般的に使用されるフォントの組み合わせと一般的なフォント ファミリをいくつか示します。

セリフ フォント

##フォントテキストの例ジョージア、セリフ"Palatino Linotype"、"Book Antiqua"、Palatino、セリフ#これは見出しですこれは段落です#これは見出しですこれは段落です
これは見出しです これは段落です

##「タイムズ ニュー ローマン」、タイムズ、セリフ

##

sans - セリフ文字体

本例Arial、Helvetica、sans-serif
文字体

#これは見出しです

これは段落です

Arial Black、ガジェット、サンセリフ

これは見出しです

これは段落です

「Comic Sans MS」、筆記体、サンセリフ体

これは見出しです

これは段落です

Impact、Charcoal、sans-serif

Thisは見出しです

これは段落です

"Lucida Sans Unicode"、"Lucida Grande"、sans-serif

これは見出しです

これは段落です

タホマ、ジュネーブ、サンセリフ

これは見出しです

これは段落です

「トレビュシェット MS」、ヘルベチカ、サンセリフ

これは見出しです

これは段落です

ヴェルダナ、ジュネーブ、サンセリフ

これは見出しです

これ段落です

等幅文字

この例
文字体
#"Courier New"、Courier、等幅

これは見出しです

これは段落です

「Lucida Console」、モナコ、等幅

これは見出しです

これは段落です

(学习ビデオ分享:cssvideo教程

以上がHTMLでフォントを設定するための属性は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。