CSS

개요

CSS(Cascading Style Sheets)는 웹 페이지의 마크업 언어(예: HTML)에 적용하여 문서의 시각적 표현을 정의하는 스타일시트 언어이다. 이를 통해 레이아웃, 색상, 폰트 등 다양한 디자인 요소를 제어할 수 있다.

CSS는 1994년 10월 10일 하콘 비움 리에 의해 처음 제안되었으며, 이후 여러 버전으로 발전해왔다.

1996년 12월에 발표된 CSS 레벨 1은 폰트 속성, 텍스트 색상, 배경, 여백, 패딩 등의 기본적인 스타일링 기능을 제공하였다.

1998년 5월에 발표된 CSS 레벨 2는 포지셔닝, 미디어 타입 지원, 테이블 레이아웃 등 새로운 기능을 추가하였다.

CSS2의 오류를 수정하고 일부 기능을 개선한 CSS 레벨 2.1은 2011년 6월에 W3C 권고안으로 발표되었다.

CSS3는 모듈화된 접근 방식을 도입하여 각 모듈이 독립적으로 개발되고 업데이트될 수 있게 하였다. 이를 통해 그림자 효과, 그라데이션, 변형 등 다양한 기능이 추가되었다.

CSS는 선택자와 선언 블록으로 구성된다. 선택자는 스타일을 적용할 HTML 요소를 지정하며, 선언 블록은 중괄호({})로 감싸고, 그 안에 속성과 값을 콜론(:)으로 구분하여 정의한다. 각 선언은 세미콜론(;)으로 끝난다.

예시:

선택자 {
  속성명: 속성값;
}

p {
  color: red;
  font-size: 16px;
}

CSS 선택자는 스타일을 적용할 요소를 지정하는 데 사용된다. 주요 선택자에는 다음과 같은 것들이 있다:

CSS에서는 상위 요소에 적용된 스타일이 하위 요소에 상속될 수 있다. 또한, 여러 스타일 규칙이 적용될 경우 우선순위에 따라 최종 스타일이 결정되는데, 이를 캐스케이딩이라고 한다. 우선순위는 중요도, 명시도, 소스 코드의 순서 등에 따라 결정된다.

CSS의 박스 모델은 요소의 레이아웃을 결정하는 기본 구조로, 다음과 같이 구성된다:

CSS의 display 속성은 요소의 박스 유형을 결정하며, 주요 값은 다음과 같다: