max-height

CSS の max-height 記述子は、@viewport @-規則で定義された文書のビューポートの最大の高さを指定します。

最大の高さの制約を考慮して、最初の高さは初期ビューポートの高さにできるだけ近い値に設定されます。

関連する @規則@viewport
初期値auto
パーセンテージrefer to the height of the initial viewport
計算値長さで指定されると相当する絶対的な長さ、パーセンテージとして指定されると指定値、それ以外では auto

構文

/* Keyword value */
max-height: auto;

/* <length> values */
max-height: 400px;
max-height: 50em;
max-height: 20cm;

/* <percentage> value */
max-height: 75%;

auto
使用する値は他の CSS 記述子の値から計算されます。
<length>
負ではない絶対値または相対値。
<percentage>
垂直方向の長さについて、初期ビューポートの高さである表示倍率1.0 に対するパーセンテージの値。値は負ではない必要があります。

形式文法

<viewport-length>

where
<viewport-length> = auto | <length-percentage>

where
<length-percentage> = <length> | <percentage>

@viewport {
  max-height: 600px;
}

仕様書

仕様書 策定状況 コメント
CSS Device Adaptation
"max-height" descriptor の定義
草案 初期定義

ブラウザー実装状況

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
max-height descriptorChrome 完全対応 29Edge 完全対応 12
接頭辞付き
完全対応 12
接頭辞付き
接頭辞付き -ms- のベンダー接頭辞が必要
Firefox 未対応 なしIE 完全対応 10
接頭辞付き
完全対応 10
接頭辞付き
接頭辞付き -ms- のベンダー接頭辞が必要
Opera 完全対応 16
完全対応 16
未対応 11.1 — 15
Safari 未対応 なしWebView Android 完全対応 4.4Chrome Android 完全対応 29Firefox Android 未対応 なしOpera Android 完全対応 16
完全対応 16
未対応 11.1 — 14
Safari iOS 未対応 なしSamsung Internet Android 完全対応 2.0

凡例

完全対応  
完全対応
未対応  
未対応
使用するには、ベンダー接頭辞または異なる名前が必要です。
使用するには、ベンダー接頭辞または異なる名前が必要です。