이번 시간에는 CSS란 무엇인가에 대해 알아보는
시간을 가져보도록 하겠습니다.
CSS란 무엇인가?
CSS는 HTML로 작성된 문서를 실제로
웹 사이트에 표현되는 방법을 정해주는
스타일 시트 언어입니다.
마크업 언어가 웹사이트의 몸체를 담당한다면
CSS는 옷과 악세서리 처럼 꾸미는 역할을
담당한다고 할 수 있습니다.
즉, HTML 구조는 그대로 두면서 CSS 파일만
변경해도 전혀 다른 웹사이트를 구성할 수 있고
현재 개발중인 CSS3의 경우는 그림자 효과,
그라데이션, 변형 등 그래픽 편집 프로그램으로
제작한 이미지를 대체 할 기능이 추가되었습니다.
또한 다양한 애니메이션 기능이 추가되어
어도비 플래시를 어느 정도 대체하고 있습니다.
CSS3 의 역사
css는 1994년 10월 10일 하콤 비움 리(Håkon Wium Lie)가 처음 제안한 언어입니다.
CSS는 지속적으로 새로운 버전이 나오던 언어로
1996년에 도입된 CSS 1은 CSS의 바탕이 되었습니다.
CSS의 표준으로는 CSS 2.1이 있고 이전 버전에
비해 새로운 기능과 도구가 추가되었습니다.
대다수의 웹 브라우저는 CSS3를 지원하고 있으며
현재 W3C에서는 CSS3를 표준으로 하고 있습니다.
- CSS1
- 첫 CSS 규격은 공식 W3C에 권고안이 되며
이름은 CSS1이다. - 1996년 12월 처음 발표됨
- 첫 CSS 규격은 공식 W3C에 권고안이 되며
- CSS2
- W3C가 개발하였으며 1998년 5월 권고안으로 발표
- CSS3
- CSS3는 2005년 12월 5일 이후 개발중에 있는 언어
- W3C CSS3 로드맵은 요약과 도입부를 제공하고 있음
- 전체가 모듈화되어 사용자 에이전트가 모듈에 대한 모든
모듈을 지원하지 않거나 자유롭게 선택할 수 있도록 함
- CSS4
- 하나의 통합된 CSS4는 없으나 여러 개의 모듈로 나뉨
- 하지만 CSS4 자체는 현재 없음
CSS의 문법
CSS는 단순한 문법을 가지고 있으며 수많은
영어 키워드를 사용해 다양한 스타일의
프로퍼티의 이름을 규정합니다.
스타일 시트는 규칙의 목록으로 구성됩니다.
각 규칙이나 규칙 집합은 하나 이상의
셀렉터와 하나의 선언 블록을 이룹니다.
선택자
CSS에서 선택자, 또는 셀렉터(selector)는
어느 부분의 마크업에 스타일을 적용할 지 선언합니다.
태그명(태그의 이름)과 클래스, ID로 선택할 수
있으며 클래스와 ID들은 대소문자로 구분하며
문자로 시작해야 하고 영숫자 또는 언더바(_)를
포함할 수 있습니다. 클래스는 어떠한 요소의
어떠한 수의 인스턴스에도 적용할 수 있고
ID는 하나의 요소에만 적용할 수 있습니다.
ID 값은 앞에 #을 붙이고 클래스는
앞에 ( . )을 붙입니다.
선언 블록
선언 블록은 괄호로 이루어진 선언들의
목록으로 이루어집니다.
각 선언은 프로퍼티 쌍점( : )의 값으로 구성되고
한 블록 안 여러 선언이 있으며
쌍반점( ; , 세미콜론)이 개개의 각 선언에
삽입되어야 하며 단 하나의 선언이라도
세미콜론을 넣지 않으면 동작하지 않습니다.
CSS 라이브러리
CSS 라이브러리는 웹 사이트의 디자인을
빠르게 선택할 수 있는 라이브러리와 기능을
보완해주는 라이브러리로 구성되어 있습니다.
- 디자인 라이브러리
- BootStrap
- Semantic-UI
- W3.CSS
- W3 Schools
- 기능 보완 라이브러리
- Prefix Free
- Fontello
참고 자료
'프론트 엔드 > CSS' 카테고리의 다른 글
[CSS] CSS 1강 - CSS 시작하기 (0) | 2023.02.18 |
---|---|
[CSS,JS] CSS 노트 원고지 만들기 (0) | 2022.02.27 |
[CSS] SASS와 SCSS (0) | 2022.01.30 |