max()複数の値から常に最大値となる値を適用する
max()
関数は、CSS プロパティに指定する値を引数にカンマ区切りで指定しておくことで、算出値に応じてその中から「最大値」となる値を適用することができる CSS 関数です。
引数には、1つ以上の値を指定可能です。2つ以上の値を指定する場合はカンマ区切りで指定します。
calc()
関数と同様に、四則計算(加算(+
)、減算(-
)、乗算(*
)、除算(/
))を使用することもでき、プロパティの値として、<length>(長さ)、<frequency>(周波数)、<angle>(角度)、<time>(時間)、<percentage>(%)、<number>(数値)、<integer>(整数) 型の値が許容される場所であれば使用できます。
max()のサンプルソース
.sample { font-size: max(10 * (1vw + 1vh) / 2, 12px); }
主要ブラウザの対応
IE11 | × |
---|---|
Edge(EdgeHTML) | × |
Edge(Chromium) | ○ |
Chrome | ○ |
Firefox | ○ |
Safari | ○ |
iOS Safari | ○ |
Android Chrome | ○ |