CSS相對(duì)單位有很多，常見的有像素（px），百分比（%），em（em），和rem（rem）。下面將分別介紹這四種相對(duì)單位，并給出具體的代碼示例。
- 像素（px）：
像素是相對(duì)于屏幕分辨率的單位，它的值是固定的，不會(huì)根據(jù)用戶的設(shè)置而改變。例如，如果你將元素的寬度設(shè)置為100px，那么它的寬度就會(huì)保持為100個(gè)像素。
代碼示例：
div {
width: 100px;
height: 50px;
}
登錄后復(fù)制
- 百分比（%）：
百分比是相對(duì)于父元素的單位，它的值會(huì)根據(jù)父元素的大小而改變。也就是說(shuō)，百分比單位可以根據(jù)屏幕尺寸的變化而自動(dòng)調(diào)整元素的大小。例如，如果父元素的寬度是200px，而你將子元素的寬度設(shè)置為50%，那么子元素就會(huì)占據(jù)父元素寬度的一半。
代碼示例：
.parent {
width: 200px;
}
.child {
width: 50%;
height: 50px;
}
登錄后復(fù)制
- em（em）：
em是相對(duì)于元素自身字體大小的單位。例如，如果一個(gè)元素的字體大小為16px，那么1em就等于16px，2em就等于32px，以此類推。em單位可以方便地實(shí)現(xiàn)字體大小的相對(duì)調(diào)整。
代碼示例：
p {
font-size: 16px;
}
span {
font-size: 1.5em; /* 相當(dāng)于24px */
}
登錄后復(fù)制
- rem（rem）：
rem與em類似，不過(guò)它是相對(duì)于根元素（一般指html元素）的字體大小。rem單位可以在整個(gè)頁(yè)面中統(tǒng)一控制字體大小，同時(shí)又能實(shí)現(xiàn)相對(duì)調(diào)整。
代碼示例：
html {
font-size: 16px;
}
p {
font-size: 1.5rem; /* 相當(dāng)于24px */
}
登錄后復(fù)制
總結(jié)：
CSS中的相對(duì)單位有像素（px），百分比（%），em（em），和rem（rem）。像素單位是固定的，不會(huì)根據(jù)用戶的設(shè)置而改變。百分比單位是相對(duì)于父元素的大小而改變。em單位是相對(duì)于元素自身字體大小的單位，而rem單位是相對(duì)于根元素的字體大小的單位。在實(shí)際應(yīng)用中，我們可以根據(jù)需要選擇合適的相對(duì)單位來(lái)控制元素的大小和字體的大小。
