한눈에 보는 정의
웹페이지의 색, 글꼴, 여백, 배치, 움직임 같은 모양을 정하는 언어.
이런 말로 들어요
- 색이랑 여백은 CSS에서 한 번에 바꿀 수 있게 정리해 둘게요.
- 모바일에서 깨지는 건 CSS 배치 문제라 금방 잡힙니다.
그림으로 보기
HTML은 그대로 두고 CSS만 바꿔 모양을 바꿉니다. 상세 페이지에서 테마를 직접 바꿔 볼 수 있습니다.
하캄솔루션 자체 제작 설명도식직접 해 보기
상담 신청
문의를 남겨 주세요.
border-radius: 4px;자세히 알아보기
HTML이 내용과 구조를 표시한다면 CSS는 그것을 어떻게 보이게 할지 정합니다. 같은 HTML이라도 CSS에 따라 전혀 다른 디자인이 됩니다. 화면 크기에 따라 배치를 바꾸는 반응형 디자인, 버튼에 마우스를 올렸을 때의 효과도 CSS로 만듭니다.
실무 예시
예를 들어 브랜드 남색을 CSS 변수 하나로 정해 두면, 나중에 색을 바꿀 때 사이트 전체 버튼과 제목 색이 함께 바뀝니다.
함께 살펴볼 점
페이지마다 따로 스타일을 덧붙이면 나중에 수정할 곳을 찾기 어렵습니다. 색·글꼴·여백 같은 공통 값은 한곳에서 관리합니다.
AI에게 이렇게 요청해 보세요
이 사이트 CSS에서 반복되는 색과 여백 값을 찾아 CSS 변수로 정리해 줘. 화면 모양은 바뀌지 않아야 해.
코딩·작성 도구에 붙여 쓰기 전에 내 상황에 맞게 바꾸고, 결과는 직접 확인하세요.출처와 검토 정보
- CSS - Glossary | MDN 새 창
MDN 용어집에서 CSS가 웹페이지 표현을 기술하는 언어라는 정의를 확인했습니다.
자료 확인 - CSS: Cascading Style Sheets | MDN 새 창
CSS 학습·참조 문서의 범위를 확인했습니다.
자료 확인
내용 검토
최초 발행 · 내용 수정