我需要將 rem 設置為 16px 嗎？

Question

為了方便起見，我一直將750px設計稿定義為750rem。

即1rem=1px。

但是今天看到一個新的觀點認為rem應該可以和em進行轉換，

所以 1 rem 等於 16 px。 我認為這是有道理的。

誰能分享一下這兩種解決方案的優缺點？

================================================ ==========

我的問題是rem的設置是否應該按照375設計稿中1rem=16px的設置

也就是說常規的750設計稿1Rem=32px

應該是750個設計稿。 1Rem=75px。

這有利於計算。

Answer 1

我知道有一種做法可以將 rem 重寫為 10px，這在計算中非常方便。 然而，這種做法有多好是個問題，因為通常所有設計都使用 4 的重數：4、8、12、16。

Answer 2

始終使用rem來提高響應速度、可訪問性和易用性。
使用px沒有意義（除非確實需要）。 特別是在這個響應時代。

鑒於易用性的論點，並且知道默認的瀏覽器代理字體大小是 16px，這意味着 2rem 將等於 32px，並且除非您以 16 為增量非常酷，否則使用更大的數字，使用以 10 為基數的系統：

html {
  font-size: 62.5%;  /* now 1rem === 10px */
}

#someElement {
  padding: 1rem;   /* 10px padding */
  font-size: 2rem; /* 20px font size */
}

或者，如果您喜歡默認的16 ，您可以隨時使用 ie： font-size: calc(1rem * 3); /* 48px */ font-size: calc(1rem * 3); /* 48px */

如果您需要總體字體可伸縮性，另一個技巧是使用基本字體大小設置為所需的鉗位或相對於視口的單位（如vh 、 vmin等...）。 但那是另一回事了。

Answer 3

rem單位優點：

1. 可伸縮性： rem單位是可伸縮的，這意味着更改根font-size將按比例縮放所有元素，這對響應式設計很有用。

2. 可訪問性： rem單位可以提高難以閱讀較小文本的用戶的可訪問性。

---

使用rem單位有一些缺點：

1. complexity ：使用rem單位可能會增加設計的復雜性，您需要考慮根font-size和單個元素的大小。

2. 瀏覽器支持：現代瀏覽器廣泛支持rem單位，但可能無法在舊瀏覽器中使用。