DevToolPal
VI

Đơn vị CSS

Đổi px sang rem

Đổi pixel (px) sang rem (rem). 1 px = 0,0625 rem và 1 rem = 16 px.

Công thức

rem = px ÷ 16

Cách chuyển đổi

Để đổi pixel sang rem, hãy chia giá trị cho 16. Ví dụ: 32 px = 2 rem.

Bảng quy đổi

px rem
1 px 0,0625 rem
2 px 0,125 rem
4 px 0,25 rem
8 px 0,5 rem
10 px 0,625 rem
12 px 0,75 rem
14 px 0,875 rem
16 px 1 rem
18 px 1,125 rem
20 px 1,25 rem
24 px 1,5 rem
32 px 2 rem
48 px 3 rem
64 px 4 rem

Bảng giả định cỡ chữ gốc 16px. Hãy đổi cài đặt trong bộ chuyển đổi phía trên cho khớp với dự án của bạn.

Về các đơn vị này

Trình duyệt quy đổi mọi độ dài CSS ra pixel. rem tính theo cỡ chữ gốc, em tính theo cỡ chữ của phần tử cha; cả hai đều là 16px trên mọi trình duyệt lớn trừ khi trang hoặc người dùng thay đổi. 1pt là 1/72 inch và 1px là 1/96 inch, nên 1pt = 1,333px. vw là 1% chiều rộng viewport, nên số pixel phụ thuộc vào màn hình.

Câu hỏi thường gặp

› Làm sao đổi px sang rem?

1 px = 0,0625 rem. Để đổi, hãy chia giá trị cho 16: 32 px = 2 rem.

› 1 rem bằng bao nhiêu px?

1 rem = 16 px. Công thức ngược là px = rem × 16.

› Vì sao dùng rem thay cho px?

Kích thước rem theo cỡ chữ người dùng đặt trong trình duyệt, tốt cho khả năng tiếp cận, và chỉ cần đổi một giá trị gốc là toàn bộ bố cục co giãn nhất quán.

› rem và em khác nhau thế nào?

rem luôn dùng cỡ chữ gốc (html). em dùng cỡ chữ của phần tử cha, nên các giá trị em lồng nhau sẽ nhân lên.