CSS 中常常使用像素 (px) 單位來制定元素尺寸，但 px 單位具有固定數值且無法跟隨屏幕大小變化而自適應的缺點。為了解決這個問題，我們可以將 px 單位轉換成相對單位 rem。

rem 是相對于根元素（即根標簽 html）字體大小的單位。這意味著我們只需要在根元素中設置一個合適的字體大小，就可以方便地使用 rem 單位來制作響應式布局。

html {
font-size: 16px;      /* 設置根元素字體大小為 16px */
}
p {
font-size: 1rem;      /* 使用 rem 的優勢，可根據父元素字體大小自動調整 */
padding: 0 1rem;      /* 使用 rem 單位制定內邊距 */
line-height: 1.5rem;  /* 同樣適用于行高 */
}

當屏幕尺寸發生變化時，根元素的字體大小也會隨之變化，從而使 rem 單位自適應。這無疑能大大提高響應式布局的效率，并減少我們設置元素尺寸時的麻煩。

總之，將 px 轉換成 rem 可以幫助我們更好地進行響應式布局，并讓網站更加適配不同屏幕。