CSS font-size プロパティ 関数 要素 使い方・書き方 例 CSS サンプル
font-size CSS プロパティとは
トピック:フォントサイズ プロパティは、要素のテキストコンテンツのフォントサイズを設定する ことができる
フォントサイズ
| font-size プロパティ 値 | font-size 内容 説明 |
|---|---|
font-size :medium; 詳細 情報font-size :medium; 例 プロパティ 使い方 コード | font-size :medium;とはフォントサイズを中程度の大きさに設定することができる方法。これはデフォルトです |
font-size :xx-small; 詳細 情報font-size :xx-small; 例 プロパティ 使い方 コード | font-size :xx-small;とはフォントサイズをとても小さな xx-smallサイズに設定することができる方法。 |
font-size :x-small; 詳細 情報font-size :x-small; 例 プロパティ 使い方 コード | font-size :x-small;とはフォントサイズを少し小さなサイズに設定することができる方法 |
font-size :small; 詳細 情報font-size :small; 例 プロパティ 使い方 コード | font-size :small;とはフォントサイズを小さいサイズに設定することができる方法。 |
font-size :large; 詳細 情報font-size :large; 例 プロパティ 使い方 コード | font-size :large;とはフォントサイズを大きなサイズに設定することができる方法 |
font-size :x-large; 詳細 情報font-size :x-large; 例 プロパティ 使い方 コード | font-size :x-large;とはフォントサイズを非常に大きいサイズに設定することができる方法。 |
font-size :xx-large; 詳細 情報font-size :xx-large; 例 プロパティ 使い方 コード | font-size :xx-large;とはフォントサイズをxx-largeサイズに設定することができる方法。 |
font-size :smaller; 詳細 情報font-size :smaller; 例 プロパティ 使い方 コード | font-size :smaller;とはフォントサイズを親要素よりも小さく設定することができる方法 |
font-size :larger; 詳細 情報font-size :larger; 例 プロパティ 使い方 コード | font-size :larger;とはフォントサイズを親要素より大きなサイズに設定することができる方法 |
font-size :px; 詳細 情報font-size :10px; 例 プロパティ 使い方 コード | font-size :px;とはフォントサイズをpx、cmなどの固定サイズに設定することができる方法。 |
font-size :%; 詳細 情報font-size :50%; 例 プロパティ 使い方 コード | font-size :%;とはフォントサイズを親要素のフォントサイズのパーセントに設定することができる方法。 |
font-size :initial; 詳細 情報font-size :initial; 例 プロパティ 使い方 コード | font-size :initial;とはデフォルト値にこのプロパティを設定することができる方法。 |
プロパティ
| デフォルト値・初期値 : | medium |
|---|---|
| 適用対象 : | 全要素。 ::first-letter and ::first-line にも適用されます。 |
| 継承 : | 継承する |
| パーセンテージ : | 親要素の font-size |
| メディア : | visual |
CSS Version | CSS1 |
| 計算値 : | 指定通り。ただし相対的 length は絶対的 length に変換 |
| JavaScript 構文 | object.style.fontSize="14px" |
| アニメーションの種類 : | length |
| 正規順序 : | 形式文法で定義される一意のあいまいでない順序 |
| CSSの構文 | font-size:medium |xx-small |x-small |small |large |x-large |xx-large |smaller |larger |length |initial |inherit; |
サポートするデスクトップ ブラウザ対応・互換性
| Property | Desktop 互換性 | |||||
|---|---|---|---|---|---|---|
| font-size | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
| 基本 サポート | フルサポート◯1 | フルサポート◯12 | フルサポート◯1 | フルサポート◯5.5 | フルサポート◯7 | フルサポート◯1 |
| Rem values | フルサポート◯31 | フルサポート◯12 | フルサポート◯31 | フルサポート◯11 | フルサポート◯28 | フルサポート◯7 |
サポートするモバイル ブラウザ対応・互換性
| Property | Mobile 互換性 | ||||||
|---|---|---|---|---|---|---|---|
| font-size | Android | Chrome for Android | Edge Mobile | Firefox for Android | Opera for Android | iOS Safari | Samsung Internet |
| 基本 サポート | フルサポート◯1 | フルサポート◯1 | フルサポート◯12 | フルサポート◯4 | フルサポート◯6 | フルサポート◯1 | フルサポート◯あり |
| Rem values | フルサポート◯4.1 | フルサポート◯42 | フルサポート◯12 | フルサポート◯31 | フルサポート◯12 | フルサポート◯あり | フルサポート◯4.0 |
