Simple HTMLHTMLリファレンス

Main Menu

おすすめリンク

Site Info.

CSSプロパティ

HTMLリファレンス

CSSリファレンス

その他の記事

CSSリファレンス インデックス

スポンサーリンク

CSSリファレンス

FONTフォントTOPCSSPropertiesFont

  1. font-style欧文フォントの斜体・イタリック体
  2. font-variant欧文フォントのスモールキャップ(スモールキャピタル)
  3. font-weightフォントの太さ
  4. font-sizeフォントの大きさ
  5. line-height行の高さ
  6. font-familyフォントの種類
  7. fontフォントのショートハンドプロパティ

font-sizeフォントの大きさ

プロパティの値<absolute-size> | <relative-size> | <length> | <percentage> | inherit
初期値medium
対象要素全要素
継承する
%現在のフォントサイズに対する割合
メディアvisual
W3C Ref.CSS2.1CSS3

プロパティの書式と機能

要素内で表示するフォント(文字)の大きさを指定します。

プロパティの書式機能
font-size: <absolute-size>フォントサイズをキーワード値で絶対指定
font-size: <relative-size>フォントサイズをキーワード値で相対指定
font-size: <length>フォントサイズをLength値で指定
font-size: <percentage>フォントサイズをパーセンテージで指定
font-size: inherit継承

プロパティの値

font-size : <absolute-size>

mediumxx-smallx-smallsmalllargex-largexx-large

font-size : <relative-size>

mediumsmallerlarger

MEMO

基準となる文字の大きさ

デフォルトでは、ブラウザに設定された文字サイズがmediumの値となります。 また、ユニバーサルセレクタを用いて* {font-size:1em}と指定し、全要素の文字サイズを初期化するといった用途でも使われます。

ユーザビリティを考慮した文字サイズの指定

これは極端な例ですが、縦60ピクセルの端末で12pxのフォントサイズを指定した場合、文字高さが画面サイズの約2割にも達してしまうことになり、とても見難くなってしまうことが想像できます。 フォントサイズを指定する場合はemやパーセンテージといった標準サイズに対する相対的な大きさを指定することにより、PCと携帯端末のような解像度が極端に異なる環境でも適切な文字サイズで表示することができます。

スポンサーリンク
Copyright (C) 2010 Simple HTML. All Rights Reserved.