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