構文
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>
● 表示結果