절대 ⤢ px1/96인치(CSS 기준 픽셀). 고정 UI 크기 지정: 테두리, 헤어라인, 아이콘 크기. border: 1px solid #000; ⤢ pt1/72인치(1pt = 1.333px). 크기가 실제 용지에 대응하는 인쇄 스타일시트. font-size: 12pt; ⤢ cm1센티미터(≈37.8px). 실제 측정값이 필요한 인쇄 레이아웃. margin: 2cm; ⤢ mm1밀리미터(≈3.78px). 정밀한 인쇄 측정. padding: 5mm; ⤢ in1인치(96px = 2.54cm). 인치 단위로 크기를 지정한 인쇄 레이아웃. margin: 1in; 폰트 상대 ⤢ em요소 자신의 폰트 크기(부모로부터 상속). 주변 텍스트와 함께 스케일되는 간격. padding: 1em; ⤢ rem루트 요소의 폰트 크기(html 요소). 폰트 크기: 사용자의 루트 폰트 크기 설정을 존중합니다. font-size: 1.25rem; ⤢ ch현재 폰트에서 '0' 글리프의 폭. 읽기 좋은 줄 길이(줄당 글자 수) 설정. max-width: 70ch; ⤢ ex현재 폰트의 x-height(소문자 'x'의 높이). 서체에 연동되는 수직 메트릭. line-height: 2ex; ⤢ cap현재 폰트의 cap height(대문자 높이). 대문자에 맞춘 수직 메트릭, ex보다 더 좁습니다. padding-top: 0.5cap; ⤢ ic현재 폰트에서 '水'(물) 표의 문자의 폭. CJK 문자 한 칸을 따라가는 크기 지정. width: 4ic; ⤢ lh요소 자신의 계산된 line-height. 요소를 텍스트 정수 줄 단위로 크기 지정. height: 3lh; ⤢ rlh루트 요소의 line-height. 문서 기본 줄 높이의 배수로 간격 지정. margin-block: 2rlh; 뷰포트 상대 ⤢ %부모의 같은 속성 값. 포함 요소에 맞춘 유동 레이아웃. width: 50%; ⤢ vw뷰포트 너비의 1%. 화면 너비에 맞춘 풀-블리드 섹션. width: 100vw; ⤢ vh뷰포트 높이의 1%. 화면 높이를 가득 채우는 히어로 섹션이나 오버레이. height: 100vh; ⤢ vmin뷰포트의 작은 차원의 1%. 어떤 방향에서든 화면에 맞는 요소 크기. font-size: 5vmin; ⤢ vmax뷰포트의 큰 차원의 1%. 뷰포트의 지배적 축을 채우기. font-size: 5vmax; ⤢ svhsmall 뷰포트 높이의 1%(브라우저 UI가 모두 표시됨). 펼쳐진 브라우저 크롬 위에도 맞는 모바일 전체 높이 섹션. height: 100svh; ⤢ lvhlarge 뷰포트 높이의 1%(브라우저 UI 숨김). 브라우저 크롬이 접혀도 화면을 계속 덮어야 하는 배경. height: 100lvh; ⤢ dvhdynamic 뷰포트 높이의 1%. 브라우저 UI가 나타나고 사라지는 것을 따라갑니다. 100vh의 모바일 수정판: 브라우저 크롬이 나타나면 높이가 다시 맞춰집니다. height: 100dvh; ⤢ svwsmall 뷰포트 너비의 1%. 가장 좁은 뷰포트 상태를 위한 svh의 너비 버전. width: 100svw; ⤢ lvwlarge 뷰포트 너비의 1%. 가장 넓은 뷰포트 상태를 위한 lvh의 너비 버전. width: 100lvw; ⤢ dvwdynamic 뷰포트 너비의 1%. 브라우저 UI를 따라갑니다. 크롬과 함께 뷰포트가 변할 때의 dvh의 너비 버전. width: 100dvw; ⤢ vi인라인 축을 따른 뷰포트 크기의 1%(가로 쓰기 모드에서는 너비). 쓰기 방향을 따라가는 뷰포트 크기 지정. width: 50vi; ⤢ vb블록 축을 따른 뷰포트 크기의 1%(가로 쓰기 모드에서는 높이). 세로 쓰기 모드에서도 올바르게 유지되는 뷰포트 크기 지정. height: 50vb; 유동 ⤢ clamp()최솟값과 최댓값으로 묶인 선호 값. 최솟값이나 최댓값을 벗어나지 않는 유동 타이포그래피. width: clamp(320px, 80vw, 1100px); ⤢ min()쉼표로 구분된 인수 중 가장 작은 값. 최댓값을 넘지 않도록 크기를 제한. width: min(100%, 600px); ⤢ max()쉼표로 구분된 인수 중 가장 큰 값. 뷰포트와 함께 커지는 최소 크기를 강제. width: max(50%, 300px); 각도 ⤢ deg전체 원의 1/360. 회전 트랜스폼과 그라데이션 각도 위치. transform: rotate(45deg); ⤢ rad라디안. 1rad ≈ 57.2958deg. 수학적으로 계산된 각도. 생성된 트랜스폼 등. transform: rotate(1.5708rad); ⤢ grad그라디안. 400grad = 전체 원 한 바퀴. 레거시 또는 측량 스타일의 각도 값. transform: rotate(100grad); ⤢ turn1turn = 360° 전체 원 한 바퀴. 한눈에 읽히는 전체·반 바퀴 회전. transform: rotate(0.5turn); 시간 ⤢ s1초. 애니메이션과 트랜지션 지속 시간. transition: opacity 0.3s; ⤢ ms1밀리초(1s = 1000ms). 짧은 UI 피드백 애니메이션과 지연. animation-duration: 150ms; 해상도 ⤢ dpi출력 장치의 인치당 도트 수. 인쇄 대상 해상도 미디어 쿼리. @media (min-resolution: 300dpi) ⤢ dppx / xpx 단위당 도트 수. 1dppx는 표준 96dpi 디스플레이에 해당. 레티나 및 고DPI 미디어 쿼리. @media (min-resolution: 2x) ⤢ dpcm센티미터당 도트 수(1dppx ≈ 2.54dpcm). 미터법 단위의 해상도 미디어 쿼리. @media (min-resolution: 118dpcm)