여러가지 형식의 스타일 시트(Cascade Style Sheet)

스타일시트 기본형식

스타일시트를 문서에 적용할때에는 보통 CSS 외부파일로 만들어서 Linked Style Sheet나 문서내부에 CSS 정의하는 Embedded Style Sheet 를 사용함

Selector(스타일을 적용하는대상) {스타일속성(Property):값(value); 스타일속성(Property):값(value);}

여러가지 속성을 한번에 적용할 일이 많은데, 이런경우 ;(세미콜론)으로 스타일과 스타일을 구분함
Embedded Style에서 특정태그 하나에 스타일을 지정할 때에 위와 같이 Selector에 스타일을 적용하려는 태그를 입력하면 됨
Selector의 형식은 적용하려는 대상의 범위에 따라 여러가지가 있다.

하나의 태그에 스타일을 지정할때 형식

 태그 {스타일속성(Property):값(value);}

여러가지 태그에 같은 스타일을 적용할 형식

 태그1, 태그2, 태그3, {스타일속성(Property):값(value);}

상태태그에 포함된 하위 태그에만 스타일을 지정할 경우에는 상위태그와 하위태그 사이에 쉼표가아닌 띄어쓰기(스페이스마)입력

 태그1 태그2 태그3 {스타일속성(Property):값(value);}

특정태그에 스타일을 지정하면, 문서 전체에 해당 태그를 사용할때마다 같은 스타일이 적용됨.
같은태그랃 상황에 따라 각각 다른 스타일을 지정하고자 할때에는 클래스(Class) 이름으로 구분하면 되요

Class 정의
태그.class 이름1 {스타일속성(Property):값(value);}
태그.class 이름2 {스타일속성(Property):값(value);}

Class 적용
<태그 class="class 이름">

ID의 정의 및 형식은 Class지정과 쓰임새가 비슷해요
ID는 한 페이지에서 오직 하나만 유효하니 ID는 한 태그에만 부여됨
그러니까 ID는 자바스크립트로 ID에 지정한 스타일 자체의 값을 수정할 수 있는 연결고리역할도 합니다.

ID 정의
#id 이름 {스타일속성(Property):값(value);}

ID 적용
<태그 id="id 이름">