無料ホームページ作成！ＣＳＳ・スタイルシート
font

無料ホームページ作成！CSS・文字
font属性

ホームページのフォントを一括設定

フォントの一括指定

このfont属性はフォント、文字の太さ、文字のサイズ、行の間隔、文字のスモールキャピタル、文字の斜体を一括で指定できる属性です、まとめて宣言できるので覚えておきましょう。
この属性には順番があり、１番目にstyle、variant、weightを好きな順番で記述
２番目にsize/height（line-height）、
最後にfamilyを記述の順で記述します。
基本は省略ができるのですが、文字のサイズとフォントは省略できません。（二つ以外は省略できます）

font属性の使い方

CSSソース

セレクタ{
	font:small-caps italic 500 20px/30px cursive;
}
 

結果

font属性で宣言できる値

スモールキャピタル

値	概要
normal	ソースに書かれたまま表示
small-caps	スモールキャピタルを設定

斜体

値	概要
normal	斜体にしない
italic	イタリック体で表示
oblique	斜体で表示

太さ

値	概要
単位付き数字	10pxなどの細かい指定ができる pt,px,mm,cm,in,pc,em,ex、等
xx-small x-small small medium large x-large xx-large	フォントサイズを名前で指定できる xx-smallから順番に大きくなっていく
smaller	親要素に対してフォントサイズを一段階小さく指定できる
larger	親要素に対してフォントサイズを一段階大きく指定できる
%	親要素に対するフォントサイズを％で指定できる

サイズ

値	概要
単位付き数字	10pxなどの細かい指定ができる pt,px,mm,cm,in,pc,em,ex、等
xx-small x-small small medium large x-large xx-large	フォントサイズを名前で指定できる xx-smallから順番に大きくなっていく
smaller	親要素に対してフォントサイズを一段階小さく指定できる
larger	親要素に対してフォントサイズを一段階大きく指定できる
%	親要素に対するフォントサイズを％で指定できる

行の間隔

値	概要
単位付き表示	pt,px,mm,cm,in,pc,em,ex、等の単位を付けて指定できる
normal	文字の間隔を通常にする

フォント

値	概要
フォント名	フォント名のフォントで表示、スペースが入る場合は"でくくる

値の使用例

サイズの後の行の間隔との間に/を入れないといけません。