max-height CSS プロパティとは
トピック：要素のコンテンツ領域の最大高さを指定する ことができる この最大高さには、パディング、枠線、または余白は含まれません CSSボックスモデルを参照 。
プロパティ max-height 要素の最大の高さを設定
実例 コード 1
サンプル コードを試すp { max-height: 100px;}div { height: 200px; max-height: 100px;}
プロパティ 定義と使用法
| デフォルト値・初期値 : | none |
|---|
| 適用対象 : | 次の要素を除く全要素：非置換インライン要素、テーブルの列、列グループ |
|---|
| 継承 : | 不可 |
|---|
| 相対値の基準 : | パーセンテージは、生成ボックスの包含ブロックの高さを基準に計算されます。 包含ブロックの高さが明示的に定義されず（コンテンツの高さに依存します）この要素が絶対位置指定されていないなら、パーセンテージ値は none として扱われます。 |
|---|
| メディア : | visual |
|---|
CSS Version | CSS2 ～ |
|---|
| 計算値 : | 指定されたパーセンテージ値または絶対的な長さ、または none |
|---|
| JavaScript 構文 | object.style.maxHeight="funWebref" |
|---|
| Animation type : | length または percentage, calc(); |
|---|
| 正規順序 : | 形式文法で定義される一意のあいまいでない順序 |
|---|
| CSSの構文 | max-height: none |length |initial |inherit; |
|---|
プロパティ値
| 値 | 説明 |
length(長さ) | 長さ値として最大の高さを指定しpx、pt、cm、em、などの負の長さの値は許されない |
percentage(パーセント) | 最大高さをパーセンテージで指定する パーセンテージは、要素を含むブロックの高さに対して計算される 負のパーセント値は許可されない |
none | 高さには最大値がありません。これはデフォルト値です。 |
initial | このプロパティをデフォルト値に設定する |
inherit | 親要素からこのプロパティを継承する |
サポートするブラウザ対応・互換性
| Property | Chrome | Edge | Firefox | Safari | Opera |
|---|
| max-height | 1.0 | 7.0 | 1.0 | 2.0.2 | 7.0 |
CSS max-height | CSS プロパティ 値| 意味 使い方 実例 – WebRef