Question 1

CSS clamp()는 무엇을 하나요?

Accepted Answer

CSS clamp()는 무엇을 하나요? clamp(MIN, VAL, MAX)는 MIN과 MAX 사이의 값을 고릅니다. VAL이 MIN보다 작으면 MIN, MAX보다 크면 MAX, 아니면 VAL을 반환합니다. 너무 작지도 크지도 않은 유동 크기에 완벽합니다.

Question 2

clamp()는 min()·max()와 어떻게 다른가요?

Accepted Answer

clamp()는 min()·max()와 어떻게 다른가요? min()은 가장 작은 값을, max()는 가장 큰 값을 고르고, clamp()는 둘을 결합해 중간값을 하한과 상한 사이에 고정합니다. clamp()는 유동 타이포그래피의 주력입니다.

Question 3

clamp()는 모든 브라우저에서 지원되나요?

Accepted Answer

clamp()는 모든 브라우저에서 지원되나요? 네. clamp(), min(), max()는 2020년 이후 모든 모던 브라우저에서 지원됩니다(Chrome 79+, Firefox 75+, Safari 13.1+).

Question 4

유동 타이포그래피에 어떤 뷰포트 크기를 써야 하나요?

Accepted Answer

유동 타이포그래피에 어떤 뷰포트 크기를 써야 하나요? 일반 사이트는 320px-1200px, 모바일 우선 프로젝트는 360px-768px가 일반적입니다. vmax를 넘으면 크기는 최대값에 고정됩니다 — 의도된 동작입니다.

Question 5

clamp()를 간격에도 쓸 수 있나요?

Accepted Answer

clamp()를 간격에도 쓸 수 있나요? 네. 유동 패딩과 갭도 같은 공식입니다: clamp(16px, 4vw, 48px). 유동 간격은 추가 미디어 쿼리 없이 기기 간 리듬을 유지합니다.

Clamp 계산기

Clamp 계산 가이드