변수
Coddy HTML 여정의 Practical Frontend 섹션에 포함된 레슨 — 35개 중 1번째.
더 크고 복잡한 웹사이트를 만들수록, 반복되는 색상, 크기 또는 글꼴을 관리하는 것이 더 어려워집니다. 하나의 값을 변경하려면 여러 곳을 업데이트해야 합니다.
CSS 변수를 사용하면 이러한 값들을 이름으로 저장하고(--main-color와 같이) CSS 전체에서 재사용할 수 있습니다. 변수를 한 번만 변경하면 모든 곳에서 자동으로 업데이트됩니다.
그것들은 코드를 깔끔하고 일관되게 유지하는 데 매우 유용하며, 많은 개발자가 현대적인 웹사이트를 구축하는 데 이를 사용합니다.
실력 점검이 레슨에는 짧은 퀴즈가 포함되어 있습니다. 레슨을 시작해 문제를 풀고 진행 상황을 기록하세요.
실력 점검이 레슨에는 짧은 퀴즈가 포함되어 있습니다. 레슨을 시작해 문제를 풀고 진행 상황을 기록하세요.
치트 시트
CSS 변수를 사용하면 값을 이름으로 저장하고 CSS 전체에서 재사용할 수 있습니다. 이는 코드를 깔끔하고 일관되게 유지하는 데 도움이 됩니다.
-- 접두사로 변수를 정의하고 var()를 사용하여 사용합니다:
:root {
--main-color: blue;
}
.element {
color: var(--main-color);
}변수를 한 번만 변경하면 모든 곳에서 자동으로 업데이트됩니다.
직접 해보기
이 레슨에는 코드 챌린지가 없습니다.
실력 점검이 레슨에는 짧은 퀴즈가 포함되어 있습니다. 레슨을 시작해 문제를 풀고 진행 상황을 기록하세요.