PR

構文

width : 幅;
height : 高さ;

説明文

 「width」,「height」はブロック要素などのボックスの大きさを指定する。widthでボックスの幅,heightで高さを指定する。

 指定には以下のような単位が利用できる。

単位意味
inインチ(1インチ=25.4mm)
cmセンチ・メートル
mmミリ・メートル
ptポイント(72ポイント=1インチ)
pcパイカ(1パイカ=12ポイント)
pxディスプレイの表示に利用する画素(ピクセル)
em要素で指定されているフォントのサイズを基準とした倍数。例えば,12ptのサイズを指定している要素に2emを指定すると,倍の24ptとなる
ex要素で指定されている小文字フォントのサイズを基準とした倍数
%親要素を基準とした割合

 また,「auto」を指定すると,Webブラウザが自動的に大きさを決定する。

[画像のクリックで拡大表示]

使用例

● CSSの定義

div { width : 70%;
      height : 200px;
      background-color : #ffd0d0;
      padding : 10px;
      border : 2px red solid;
}

● HTMLの例

<h3>ボックス・サイズの指定</h3>
<p>「width」と「height」でブロック要素などといったボックスの形状をする要
素の大きさを指定できる。「width」では幅,「height」では高さを指定する。</p>
</div>

● 表示結果

Internet Explorerの表示例
[画像のクリックで拡大表示]
Firefoxの表示例
[画像のクリックで拡大表示]

関連項目