本文目錄導(dǎo)讀：

1. 使用固定高度
2. 使用***小高度（min-height）
3. 使用百分比高度（%）
4. 使用視窗單位（vw/vh）

CSS中的默認(rèn)高度設(shè)置方法

在CSS中，我們可以通過多種方式設(shè)置元素的默認(rèn)高度，本文將介紹幾種常見的方法，幫助您更有效地管理網(wǎng)頁布局。

使用固定高度

在CSS中，我們可以使用“height”屬性為元素設(shè)置固定的高度。

div {
  height: 200px;
}

這將為所有的<div>元素設(shè)置一個(gè)默認(rèn)高度為200像素，這種方法適用于需要***控制元素高度的場(chǎng)景。

使用***小高度（min-height）

當(dāng)您希望元素***少有一個(gè)特定高度，但允許其根據(jù)內(nèi)容擴(kuò)展時(shí)，可以使用“min-height”屬性。

div {
  min-height: 100px;
}

這將確保所有的<div>元素***少具有100像素的高度，但如果內(nèi)容超過這個(gè)高度，元素會(huì)相應(yīng)地?cái)U(kuò)展。

使用百分比高度（%）

您還可以使用百分比來設(shè)置元素的高度，這種方法依賴于其父元素的高度。

div {
  height: 50%;  /* 高度為其父元素高度的50% */
}

如果父元素的高度未被明確設(shè)置，百分比高度可能不會(huì)按預(yù)期工作，在使用百分比高度時(shí)，請(qǐng)確保父元素具有明確的高度值。

使用視窗單位（vw/vh）

視窗單位是一種相對(duì)單位，允許您根據(jù)瀏覽器窗口的大小來設(shè)置元素的高度?！皏h”代表視窗高度的百分比。

div {
  height: 50vh;  /* 高度為瀏覽器窗口高度的50% */
}

這種方法在處理響應(yīng)式布局時(shí)特別有用，因?yàn)樗试S您創(chuàng)建在不同設(shè)備和屏幕尺寸上表現(xiàn)良好的設(shè)計(jì)，請(qǐng)注意這種方法在某些老版本的瀏覽器中可能不受支持。