Lengths

CSS의 길이 값은 부호(+ 또는 -) + 숫자 + 단위(px, em, 등)의 형식으로 표현합니다. 부호는 생략될 수 있으며 생략되었을 때에는 당연히 +입니다. 또한 길이 값이 0인 경우에는 길이의 단위를 생략할 수 있습니다. 길이는 단위에 따라 상대 길이(relative)와 절대 길이(absolute)로 구분할 수 있습니다. 상대 길이는 다른 길이 속성에 따른 상대적인 크기를 의미하고, 스타일 시트에서 상대적인 길이 값을 사용하면 보다 유연하게 크기를 적용할 수 있습니다.

상대 길이 단위

상대적인 값은 상속되지 않습니다. 다만, 상대적인 값에 근거해서 산술된 값은 상속됩니다.
em
현재 사용중인 폰트 크기에 대한 상대적인 크기입니다.
ex
알파벳 소문자 x의 높이값에 대한 상대적인 크기입니다.
ch
숫자 0의 너비값에 대한 상대적인 크기입니다.
rem
최상위 요소의 폰트 크기에 대한 상대적인 크기입니다.
vw
뷰포트의 너비에 대한 상대적인 크기입니다.
vh
뷰포트의 높이에 대한 상대적인 크기입니다.
vmax
뷰포트의 가로/세로 크기 중 큰 값에 대한 상대적인 크기입니다.
vmin
뷰포트의 가로/세로 크기 중 작은 값에 대한 상대적인 크기입니다.

절대 길이 단위

절대 단위는 사용자들이 추정할 수 없는 단위이므로 가능하면 사용하지 않는 것이 바람직합니다.
in
인치
cm
센티미터
mm
밀리미터
pt
포인트 (1/72 인치)
pc
피카 (12 포인트)
px
화면의 해상도에 따른 크기 입니다.

알립니다!

사이드바의 프로퍼티 목록 중 뒤에 별표(*)가 붙은 것은 CSS 3의 내용이 반영되지 않은 것입니다.

읽으신 글에 수정할 내용, 추가할 내용 등이 있다면 부담없이 댓글을 남겨 주세요.