CSSフォント（書体）
CSSのフォントプロパティは、フォント、太字、サイズ、テキストスタイルを定義します。
間のセリフとサンセリフのフォントの違い
コンピュータ画面上では、サンセリフフォントはセリフフォントよりも読みやすいと考えられています
CSSフォント
CSSでは、フォントファミリ名の2つの種類があります。
- 一般的なフォントファミリ - （例えば、「セリフ」や「モノスペース」など）同様の外観フォントシステムの組み合わせを持っています
- 特定のフォントファミリ - （例えば、「タイムズ」や「宅配便」など）は、特定のフォントファミリ
| 一般的な家族 | フォントファミリー | 説明 |
|---|---|---|
| セリフ | Times New Roman ジョージア | エンドセリフフォントは装飾の行に余分な文字を持っています |
| サンセリフ体 | Arialの MS Pゴシック | なし追加の装飾で終わりにこれらのフォント - 「サンセリフ」なしで意味します |
| モノスペース | クーリエ新 ルシーダコンソール | すべて等幅の文字が同じ幅を持っています |
フォントファミリー
テキストフォントファミリのフォントファミリのプロパティ。
font-familyプロパティは、ブラウザが最初のフォントをサポートしていない場合、彼は次のフォントをしようと、「フォールバック」メカニズムとして、いくつかのフォント名を設定する必要があります。
注：フォントファミリの名前が複数の単語である場合、そのようなフォントファミリのような引用符で囲む必要があります」。のTimes New Romanを"
：複数のフォントファミリは、カンマで区切られたことにより、指定されています
より一般的に使用されるフォントの組み合わせによっては、当社のを見てWebセーフフォントの組み合わせ 。
フォントスタイル
主属性は、フォントスタイル斜体テキストを指定します。
このプロパティには、3つの値があります。
- ノーマル - 通常の表示テキスト
- 斜体 - 斜体で表示されるテキスト
- 歪んだ文字 - 片側はテキストに傾い（イタリック体に非常に類似し、あまりサポートされます）
例
p.italic {font-style:italic;}
p.oblique {font-style:oblique;}
»をお試しください
フォントサイズ
テキストのフォントサイズのプロパティのサイズ。
Webデザインのテキストのサイズを管理することができることは非常に重要です。 ただし、段落が見出しのように見える、またはタイトルは、段落のように見えるようにするためにフォントサイズを調整することはできません。
正しいHTMLタグを使用してください。<H1> - <H6>はタイトルを表し、<P>は段落を表します。
フォントサイズの値は、絶対的または相対的なサイズにすることができます。
実寸：
- 指定したサイズのテキストを設定します。
- 我々は、すべてのブラウザで文字サイズを変更することはできません
- 便利なの絶対的な大きさの出力の物理的なサイズを決定します
相対的なサイズ：
- サイズを設定するために周囲の要素に対して
- これは、ユーザーがブラウザで文字サイズを変更することができます
あなたは、フォントサイズ、デフォルトのサイズ、および通常のテキストの段落を指定しない場合、それは16ピクセルです（に16px = 1EM）。
フォントサイズの画素を設定します
画素とテキストサイズを設定すると、あなたのテキストのサイズを完全に制御できます：
上記の例9は、Firefoxの、クローム、オペラ、およびSafariは、Internet Explorerブラウザをスケーリングすることにより、テキストのサイズを調整します。
あなたは、ブラウザのズームツールを使用して文字サイズを調整することができますが、しかし、この調整は、ページ全体だけでなく、テキストです
フォントサイズを設定するためにそれらを使用
Internet Explorerがテキストで調整することができない回避するために、多くの開発者ではなく、画素の全角単位を使用します。
全角ユニットは、W3Cで推奨されています。
1EMは、現在のフォントサイズに等しいです。 ブラウザのデフォルトではテキストサイズは16pxにあります。
したがって、1EMのデフォルトサイズは16pxにあります。 PX / 16 = EM：下記式EMピクセルに変換することができます
例
h2 {font-size:1.875em;} /* 30px/16=1.875em */
p {font-size:0.875em;} /* 14px/16=0.875em */
»をお試しください
上記の例では、テキストの全角サイズはピクセル単位で前の例と同じです。 あなたは全角ユニットを使用する場合は、すべてのブラウザで文字サイズを調整することができます。
残念ながら、IEはまだブラウザの問題です。 テキストのサイズを変更し、それは、サイズが通常よりも小さくまたは大きくなります。
百分率およびEMの組み合わせを使用します
すべてのブラウザソリューションでは、デフォルトのフォントサイズの設定<body>要素はパーセンテージであります：
例
h1 {font-size:2.5em;}
h2 {font-size:1.875em;}
p {font-size:0.875em;}
»をお試しください
私たちのコードは非常に有効です。 すべてのブラウザで同じテキストサイズを表示し、すべてのブラウザがテキストサイズをズームすることができますすることができます。
より多くの例
太字フォントを設定します。
この例では、フォントを太字に設定する方法を示します。
あなたは、フォントの変更を設定することができます
この例では、フォントの変更を設定する方法を示します。
1宣言内のすべてのフォントのプロパティ
この例では、1つの宣言でフォントプロパティを設定するには、短縮形のプロパティを使用する方法を示します。
すべてのCSSフォントプロパティ
| Property | 描述 |
|---|---|
| font | 在一个声明中设置所有的字体属性 |
| font-family | 指定文本的字体系列 |
| font-size | 指定文本的字体大小 |
| font-style | 指定文本的字体样式 |
| font-variant | 以小型大写字体或者正常字体显示文本。 |
| font-weight | 指定字体的粗细。 |