CSS Types

CSS Types

Editing

〈dimension〉

단위로 연결된 <number> 타입을 나타낸다.

설명

올바른 표기법

약식 표기원래 표기비고
15px15 pixels 
1rem1 rem 
1.5pt1.5 points 
2000ms2000 milliseconds 
3s3 seconds 
100hz100 Hertz 
100Hz100 Hertz약식 표기는 대소문자 구분하지 않음

잘못된 표기법

예시비고
15 px단위는 공백없이 작성해야 함
15"px"인용 부호를 사용하지 않음
3sec잘못된 초 단위 사용

사용되는 단위

단위요약
Hz

1초당 발생한 진동수를 나타낸다.

Q

1cm의 1/40을 나타낸다.

cap

대상 요소의 폰트의 대문자 높이를 상대 단위의 기준으로 사용한다.

ch
cm

96px를 2.54로 나눈 값을 나타낸다.

deg

보통 1도라고 불리는 단위를 말하며 360deg가 완전한 원을 만든다.

dpcm

1cm당 점의 수를 나타낸다.

dpi

1in(인치)당 점의 수를 나타낸다.

dppx

1픽셀당 점의 수를 나타낸다.

em

대상 요소의 폰트 크기를 상대 단위의 기준으로 사용한다.

ex

대상 요소의 폰트의 x 높이값을 상대 기준으로 사용한다.

grad

400grad(그라디안)은 완전한 원을 만든다.

ic
in

1in(인치)는 2.54cm, 96px과 동일한 값을 나타낸다.

kHz

1000Hz를 나타낸다.

lh

대상 요소의 줄 높이를 상대 단위의 기준으로 사용한다.

mm

1cm의 1/10 값을 나타낸다.

ms

밀리초(milliseconds)를 나타낸다.

pc

1in의 1/16 값을 나타낸다.

pt

1in의 1/72 값을 나타낸다.

px

스크린의 기본 단위이다. 1in의 1/96 값을 나타낸다.

rad

2π(라디안)이 완전한 원을 만든다.

rem

html 요소의 폰트 크기를 상대 기준으로 사용한다.

rlh

html 요소의 줄 높이를 상대 단위의 기준으로 사용한다.

s

초를 나타낸다.

turn

1turn(턴)이 완전한 원을 만든다.

vb

html 요소의 볼록축 방향으로 뷰포트 길이의 1%를 나타낸다.

vh

뷰포트 높이를 상대적으로 1% 높이를 갖는다.

vi

html 요소의 인라인 축 방향으로 뷰포트 길이의 1%를 나타낸다.

vmax

뷰포트의 가로와 세로 크기 중 큰쪽의 1%를 나타낸다.

vmin

뷰포트의 가로와 세로 크기 중 작은쪽의 1%를 나타낸다.

vw

뷰포트 너비를 상대적으로 1% 폭을 갖는다.

지원 웹브라우저