在CSS中,有兩種常用的單位:絕對單位和相對單位。其中,相對單位是指相對于其它元素或者視口大小而言的單位。
相對單位的種類有以下幾種:
1. em單位
em是指相對于父元素的字體大小來計算的單位。舉個例子,如果你想讓一個h1元素的字體大小為其父元素的兩倍,那么可以這樣設置樣式:h1{font-size: 2em;}
2. rem單位
rem是指相對于根元素的字體大小來計算的單位。在瀏覽器中,默認情況下根元素是html元素。因此,如果你想讓一個元素的大小為根元素的一半,那么可以這樣設置樣式:p{font-size: 0.5rem;}
3. vw單位
vw是指視口的寬度的一百分之一,也就是說1vw等于視口寬度的1%。如果你想讓一個元素的寬度為視口寬度的一半,那么可以這樣設置樣式:div{width: 50vw;}
4. vh單位
vh是指視口的高度的一百分之一,也就是說1vh等于視口高度的1%。如果你想讓一個元素的高度為視口高度的一半,那么可以這樣設置樣式:div{height: 50vh;}
總的來說,相對單位可以讓我們更加靈活地控制元素的大小和位置,使得響應式設計變得更加容易實現。
上一篇西爾貝css