Px to Rem Converter 使用指南
<p><strong>輸入：</strong>16px、根字號 16px。</p><p><strong>處理：</strong>相除。</p><p><strong>輸出：</strong>1rem；根字號變則等比縮放。<…
核心功能
- 按根字號把 px 值換算為 rem（rem = px ÷ 根字號）
- 根字號可自定義，預設 16px，適配改過 html font-size 的專案
- 結果保留 4 位小數並回顯當前 1rem 等於多少 px
- 純本地計算，不上傳任何輸入
適用場景
- 重構為 rem。
- 適配根字號。
- 核對元件尺寸。
使用步驟
- 在「畫素值」輸入需要換算的 px 數值
- 確認或修改「根字號」，多數瀏覽器預設為 16px
- 讀取結果區的 rem 值（保留 4 位小數）
- 把 rem 值填入 CSS，替換原本寫死的 px
- 如需反向核對，改用 rem 轉 px 工具復算
實用技巧
- 若 html 用 font-size: 62.5% 把根字號改成 10px，換算結果會整體變化，務必先確認實際根字號
- rem 相對根元素、em 相對父元素，混用容易算錯層級，建議全站統一用 rem
- 使用者可在瀏覽器調大預設字號，rem 會隨之縮放，這正是它利於無障礙的原因
- 邊框、1px 描邊等不需要隨字號縮放的細節建議保留 px
常見問題
- 根字號改了？
- rem 隨根字號縮放；px 固定不隨，故響應式多用 rem。
- 為何推薦用 rem？
- rem 隨根字號整體縮放，利於無障礙縮放與響應式，px 固定不隨。
- 會儲存或上傳我的內容嗎？
- 結果以瀏覽器即時計算為準，純前端本地處理、資料不上傳；生成的樣式與程式碼僅作快速產出參考，正式專案請以設計系統、規範與瀏覽器實測為準。