CSS CSS 단위
CSS 단위
절대 길이 단위
다음은 모두 절대 길이 단위이며 다른 것과 관련이 없으며 일반적으로 항상 동일한 크기로 간주됩니다. 이러한 값의 대부분은 화면 출력이 아닌 인쇄에 사용될 때 더 유용합니다
| 단위 | 이름 | 설명 |
|---|---|---|
| cm | 센티미터 | 1cm = 96px/2.54 |
| mm | 밀리미터 | 1mm = 1/10th of 1cm |
| Q | 4분의 1 밀리미터 | 1Q = 1/40th of 1cm |
| in | 인치 | 1in = 2.54cm = 96px |
| pc | Picas | 1pc = 1/16th of 1in |
| pt | 포인트 | 1pt = 1/72th of 1in |
| px | 픽셀 | 1px = 1/96th of 1in |
상대 길이 단위
상대 길이 단위는 다른 요소 (상위 요소의 글꼴 크기 또는 viewport 크기)와 관련이 있습니다. 상대 단위를 사용하면 텍스트나 다른 요소의 크기가 페이지의 다른 모든 것에 비례하여 조정되도록 신중하게 계획할 수 있다는 이점이 있습니다(반응형 웹페이지를 만들 수 있다). 웹 개발에 가장 유용한 단위가 아래 표에 나열되어 있습니다.
| 단위 | 설명 |
|---|---|
| em | 요소의 글꼴 크기. -[참고] |
| rem | 루트 요소의 글꼴 크기.- [참고] |
| ex | 요소 글꼴의 x-height. |
| ex | 요소 글꼴의 x-height. |
| ch | 요소 글꼴의 glyph "0" 의 사전 길이 (너비) 입니다. |
| lh | 요소의 라인 높이. |
| vw | viewport 너비의 1%.- [참고] |
| vh | viewport 높이의 1%. |
| vmin | viewport 의 작은 치수의 1%. |
| vmax | viewport 의 큰 치수의 1%. |
| % | em 같이 상대적으로 설정된다 |