1. CSS 구문
ㅇ 구문 형식 : selector { property1 : value1; property2 : value2; ... }
ㅇ 선택자 (selector) : HTML 요소 선택용 식별자
* [참고] ☞ CSS 선택자 (단순 선택자, 그룹 선택자, 결합 선택자, 가상 선택자) 참조
ㅇ 속성 : 값 (property : value) : CSS 속성 값의 지정 방법
- 속성명 바로 뒤에 콜론(:) 을 붙인 후 그 값을 적음 (속성명 : 값)
- 만일, 다수를 지정하려면 각각 사이에 세미콜론(;)으로 분리함
2. CSS 속성 종류
ㅇ 박스 ☞ CSS 박스 모델 참조
- margin, border , padding , width, height, box-sizing 등
ㅇ 텍스트 꾸미기 ☞ CSS 텍스트 참조
ㅇ 색상 ☞ CSS 색상 참조
ㅇ 배경 ☞ CSS 배경 참조
ㅇ 여백,테두리,패딩 ☞ CSS 여백,CSS 테두리,CSS 패딩 참조
ㅇ 페이지 레이아웃(위치지정,부유화 효과 등) ☞ CSS 위치 레이아웃 참조
ㅇ 정렬 ☞ CSS 정렬 참조
ㅇ 리스트(목록) ☞ CSS 리스트 참조
ㅇ 그림자 ☞ CSS 그림자 참조
ㅇ 시간 변형 ☞ CSS 시간 변형 참조
ㅇ 2차원 변형 ☞ CSS 2차원 변형 참조
3. 특별한 CSS 속성명
ㅇ 컨텐츠 속성 { content : 값; }
- HTML 문서로 쓰지 않고도, CSS 만으로도 내용 생성이 가능
- 주로, 가상 선택자(:after,:before)와 함께 사용
ㅇ 비표준 속성 : CSS 벤더 프리픽스 (Vendor Prefix, 공급업체 접두사)
- 속성 이름 앞에 붙는 웹브라우저 제조사 접두어 ( Vendor-prefixed Properties)
. -wekit-(속성명) : 애플 사파리,구글 크롬,오페라 등 Webkit 기반 브라우저
. -moz-(속성명) : 모질라 파이어폭스 브라우저
. -o-(속성명) : 오페라 브라우저
. -ms-(속성명) : MS社 IE 브라우저
- 실험적인 기능이 요구될 때, 웹브라우저 공급사별로 사용될 수 있으나,
지금은 이러한 접두사를 점차 안쓰고 있음
1.
2.
3.