CSSプロパティ「height」の使い方例
CSS の height プロパティは、要素の height を設定するために使用されます。
「盛り上がり」というものを期待している。
高さ: 自動または長さまたは初期または継承
能力値
- auto: デフォルト。要素の高さがコンテンツによって決まります。
- 長さ:ピクセル(px)、パーセント(%)、ビューポート単位(vh)などで、要素に固定の高さ設定します。
- 初期値にする
- 親要素の縦幅を継承します。
例えば:
- 要素の高さを200pxに固定する:
div {
height: 200px;
}
- エレメントの高さを 50% に設定する
div {
height: 50%;
}
- 要素の高さを自動調整する:
div {
height: auto;
}
- 親要素の高さを継承する:
div {
height: inherit;
}
ご注意ください
- height属性はブロックレベルの要素にだけ適用されます。
- heightとmax-height属性が同時に設定されている場合、max-heightがheightプロパティをオーバーライドします。
- 高さ(height)値が要素内容の高さよりも小さいと、要素の内容がはみ出ます。
- heightがコンテンツの高さより大きい場合、要素は引き伸ばされ、はみ出た部分は空白になります。