height

Baseline 已廣泛支援

此特性已相當成熟，可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來，各瀏覽器均已提供此特性。

height CSS 媒體特性可用於根據視口的高度（或分頁媒體的頁面框）應用樣式。

語法

height 特性被指定為表示視口高度的 <length> 值。它是一個範圍特性，這意味著你也可以使用帶字首的 min-height 和 max-height 變體來分別查詢最小值和最大值。

示例

HTML

html

<div>Watch this element as you resize your viewport's height.</div>

CSS

css

/* Exact height */
@media (height: 360px) {
  div {
    color: red;
  }
}

/* Minimum height */
@media (min-height: 25rem) {
  div {
    background: yellow;
  }
}

/* Maximum height */
@media (max-height: 40rem) {
  div {
    border: 2px solid blue;
  }
}

結果

規範

規範
媒體查詢第 4 級 # height

瀏覽器相容性

另見

幫助改進 MDN

瞭解如何貢獻

本頁面最後修改於 2025 年 7 月 14 日，由 MDN 貢獻者完成。

在 GitHub 上檢視此頁面 • 報告此內容的問題