font-weight

解説

フォントの字幅を指定します。8段階の幅を指定することになっています。ultra-condensed,extra-condensed,condensed,semi-condensed,semi-expanded,expanded,extra-expanded,ultra-expandedのいずれかを指定します。相対値で指定する場合は以下の通りとなっています。

normal	標準
wider	1段階広く
narrower	1段階狭く

プロパティ情報

値：	`ultra-condensed`,`extra-condensed`,`condensed`,`semi-condensed`,`semi-expanded`,`expanded`,`extra-expanded`,`ultra-expanded`,`normal`,`wider`,`narrower`の中からいずれか1つ。
初期値：	normal
適用対象：	全ての要素
継承：	する
パーセンテージ：	不可
適用メディア：	視覚
レベル：	2

参照

font font-style font-variant font-weight font-size font-family

使用例

ソース

CSSの記述方法はスタイルシートってなに？も参照下さい。

div.sample1 {font-stretch: normal; }
div.sample2 {font-stretch: wider; }
div.sample3 {font-stretch: narrower; }
div.sample4 {font-stretch: ultra-condensed; }
div.sample5 {font-stretch: extra-condensed; }
div.sample6 {font-stretch: condensed; }
div.sample7 {font-stretch: semi-condensed; }
div.sample8 {font-stretch: semi-expanded; }
div.sample9 {font-stretch: expanded; }
div.sample10{font-stretch: extra-expanded; }
div.sample11{font-stretch: ultra-expanded; }

HTMLの記述方法

<div class="sample1"><p>サンプル</p></div>
<div class="sample2"><p>サンプル</p></div>
<div class="sample3"><p>サンプル</p></div>
<div class="sample4"><p>サンプル</p></div>
<div class="sample5"><p>サンプル</p></div>
<div class="sample6"><p>サンプル</p></div>
<div class="sample7"><p>サンプル</p></div>
<div class="sample8"><p>サンプル</p></div>
<div class="sample9"><p>サンプル</p></div>
<div class="sample10"><p>サンプル</p></div>
<div class="sample11"><p>サンプル</p></div>

表示結果

サンプル