CSS Units
CSS에서 사용할 수 있는 다양한 단위들이다.
Absolute Units
절대 단위는 다른 어떤 것에 상대적이지 않으며 항상 같은 크기로 처리된다. 주로 출력 환경이 정해져 있을 때 유용하다.
절대 단위는 물리적 단위와 시각적 단위로 분류될 수 있다. 물리적 단위로는 in, cm, mm, pt, pc, Q가 있으며 시각적 단위로는 px이 있다.
CSS에서는 절대값을 갖는 <length>를 정의할 때 사용된다.
절대 단위의 대부분은 인쇄에 사용될 때 더 유용하나 스크린 상에서 일반적으로 사용하는 절대 단위는 px(픽셀)이다.
cm
1cm(센티미터)는 96px를 2.54로 나눈 값을 나타낸다.
in
1in(인치)는 2.54cm, 96px과 동일한 값을 나타낸다.
mm
1cm의 1/10 값을 나타낸다.
pc
1in의 1/16 값을 나타낸다.
pt
1in의 1/72 값을 나타낸다.
px
스크린의 기본 단위이다. 1in의 1/96 값을 나타낸다.
Q
1cm의 1/40을 나타낸다.
Angle Units
CSS에서 각도 값은 <angel>로 표시된 <dimension>이다.
Font Units
CSS에서 글꼴의 크기를 나타내는 상대적 값을 갖는 <length> 유형의 단위이다. 폰트 크기를 나타내는 단위이지만 다른 대상의 크기를 지정할 때도 사용되며 글꼴의 크기와 연관되어 있으므로 글꼴 크기와 유기적인 관계의 다른 대상의 크기를 지정할 때 장점을 가질 수 있다.
cap
대상 요소의 폰트의 대문자 높이를 상대 단위의 기준으로 사용한다.
ch
글꼴 크기에 대한 0(ZERO, U+0030) 문자의 너비를 상대적인 기준으로 하는 단위이다.
em
대상 요소의 폰트 크기를 상대 단위의 기준으로 사용한다.
ex
대상 요소의 폰트의 x-height를 상대 기준으로 사용한다.
ic
한국, 중국, 일본 문자(CJK)의 일반적인 어드밴스 메저(advance measure)를 나타낸다. 상대적인 기준이 되는 값은 표의 문자 '水'의 너비 또는 높이이다.
lh
요소의 line-height 속성의 값을 상대 단위의 기준으로 사용한다.
rem
html 요소(:root)의 폰트 크기를 상대 기준으로 사용한다.
rlh
html 요소(:root)의 line-height 속성 값을 상대 단위의 기준으로 사용한다.
Frequency Units
진동수 단위를 나타내며 <frequency> 자료형 데이터를 표시한다.
예를 들어서 음 높이를 나타낼 때 200Hz는 저음이고 6kHz는 고음을 나타낸다. 단위는 대소문자를 가리지 않는다.
Hz
1초당 발생한 진동수를 나타낸다.
kHz
1000Hz를 나타낸다.
Relative Units
fr
그리드 컨테이너 내에서 남은 공간에 대한 차지하는 비율 값을 나타낸다.
vb
html 요소의 블록축 방향으로 뷰포트 길이의 1%를 나타낸다.
vh
뷰포트 높이를 상대적으로 1% 높이를 갖는다.
vi
html 요소의 인라인 축 방향으로 뷰포트 길이의 1%를 나타낸다.
vmax
vw 또는 vh 중 큰 값을 나타낸다.
vmin
vw 또는 vh 중 작은 값을 나타낸다.
vw
뷰포트 너비를 상대적으로 1% 폭을 갖는다.
Resolution Units
해상도 단위는 <resolution>으로 표시된 치수이다. 모든 <resolution>의 단위는 호환되며 dppx는 표준 단위이다.
<resolution> 값의 허용 범위는 명시적으로 지정할 수 있는 범위 외에 항상 음수 값을 제외한다.
Time Units
시간을 설정하는 값은 <time>으로 표시된 치수(dimensions)이다.
