CSS中vh是一種表示視窗高度的單位,即視口高度的百分比。
使用方法如下:
元素 { height: 50vh; /* 表示高度為視窗高度的50% */ }
該屬性可用于設置元素的高度、寬度等屬性。舉個例子:
.box { height: 80vh; width: 60%; margin: 0 auto; /* 水平居中 */ background-color: #ccc; }
上面的代碼表示一個寬度為60%、高度為視窗高度的80%,水平居中的盒子。
此外,vh還可以和其他單位一起使用,如:
.box { height: calc(100vh - 20px); width: 50%; margin: 0 auto; background-color: #ccc; }
上面的代碼表示一個寬度為50%、高度為視窗高度減去20px的盒子,通過calc()函數進行計算。
總之,vh可以方便地幫助我們制作響應式網頁,并提高代碼的可讀性和可維護性。