いまさらHTML,CSS入門講座 | CSS｜横幅・高さ

widthプロパティは、要素が生成するボックスの内容領域の幅を指定します。

値)

• auto (内容に合わせて自動で幅を調節します。)
• 包含ブロックの幅を基準としたパーセンテージ( % )値
• 単位をつけた数値

※包含ブロック
ブロックレベル要素の最上位にあるブロックレベル要素の内容領域。

例)

div{
width: 300px;
background: olive;
color: white;
font-size:108%;
}

本文)
<div>テキストAAAaaa</div>

表示）

heightプロパティは、要素が生成するボックスの内容領域の高さを指定します。

値)

• auto(内容に合わせて自動で幅を調節します。)
• 包含ブロックの幅を基準としたパーセンテージ( % )値
• 単位をつけた数値

※包含ブロック
ブロックレベル要素の最上位にあるブロックレベル要素の内容領域を言います。

例)

div{
width: 300px;
height: 80px;
background: #olive;
color: #ffffff;
font-size:108%;
}

本文)
<div>テキストAAAaaa</div>

表示）