728x90
전세계에서 가장 많이 사용되고 있는 CSS 속성(property)는 font-size입니다.
font-size는 폰트의 크기를 지정하는 속성입니다.
font-size는 굉장히 쉬운 주제이지만 단위(unit)라는 어려운 개념이 껴있습니다.
이 폰트 사이즈에서 우리가 사용 할 수 있는 단위를 크게 3가지로 보자면
px vs em vs rem
위 개념들은 상대적이냐 절대적이냐라는 차이가 있습니다.
px을 사용하면 우리가 지정한 폰트의 크기가 고정되어 있습니다.
em, rem을 사용하면 사용자가 브라우저의 설정을 바꾸면
그 설정에 따라서 폰트의 크기가 달라집니다.
따라서 px은 고정된 폰트의 크기를 지정 할 때 사용하고
em, rem은 사용자가 페이지의 폰트를 가변적으로 변경 할 수 있도록 할 때 사용합니다.
상황에 따라 다르지만 기본적으로 rem을 많이 사용합니다.
폰트 크기를 조정 할 수 있는 사용자의 권리를 존중 해주기 위해서 입니다.
[ px과 rem의 차이점 ]
사용자가 브라우저의 글꼴 크기를 키웠을 때
- px은 바뀌지 않음
- rem은 바뀜
사용자가 화면 전체를 줌하고 줌아웃 하는 것 말고(전체를 키우는 것이기 때문에)
폰트의 사이즈를 변경하는 기능을 사용 했을 경우 px은 폰트의 크기가 바뀌지 않고, rem은 폰트의 크기가 가변적으로 바뀐다.
→ 사용자 입장에서는 사용자가 처해 있는 상황에 따라서 폰트의 크기를 정할 수 있도록 설정 해주는 게 좋습니다.
즉, 사용자에게 권리를 준다는 측면입니다.
728x90
댓글