📌 CSS 변수, 함수

: root

전역 CSS 변수 선언

:root{
	--main-color:royalblue;
	--pane-padding: 5px 40px;
}

var()

css 변수값 지정
첫번째 인수 - 가져올 사용자 지정 속성 이름
두번째 인수 - 대체값

strong{
	color:var(--main-color, blue);
}

calc()

css 속성 값으로 계산식 지정
사칙연산 가능

min(), max()

쉼표로 구분된 () 내 목록에서 가장 작은 또는 가장 큰 값 설정

strong{
	color:var(--main-color, blue);
}

.wrap{
	width: min(1400px, calc(100% - 60px));
	margin: auto;
}

clamp()

설정된 이상적인 값을 기준으로 상한과 하한 사이의 값 고정
최소값, 이상적인 값, 최댓값

주로 반응형 폰트 설정시 사용

.wrap{
	width: min(1400px, calc(100% - 60px));
	margin: auto;
}

출처:weniv