ClientSide/html css
[CSS] 길이 단위
치춘
2022. 3. 25. 23:29
vw / vh
v = viewport (현재 보여지는 화면 크기)
vw = 뷰포트 너비에 비례
vh = 뷰포트 높이에 비례
예시: 3vw = 뷰포트 너비의 3%
vw, vh는 부모의 너비 / 높이와 무관하다
vmin / vmax
vmin = 뷰포트 너비 / 높이 중 작은 것에 비례
vmax = 뷰포트 너비 / 높이 중 큰 것에 비례
em / rem
em = 부모의 폰트 크기에 비례
rem = 최상위 요소 (대체로 html) 의 폰트 크기에 비례
예시: 부모의 폰트 크기가 12px일 때, 3em = 12 * 3 = 36px
브라우저 기본 폰트 사이즈는 100%에서 16px이다
ex
현재 폰트의 x 높이값 (알파벳 x의 높이 값) 또는 em의 절반
ch
현재 폰트의 0 너비값 (숫자 0의 너비 값)