6장 한눈에 정리하기

<<<스타일 시트>>>

브라우저 기본 스타일 : 웹 브라우저에 웹 문서를 표시할 때 브라우저에서 기본으로 사용하는 스타일

인라인 스타일 : style속성을 사용해 필요한 요소에 스타일을 직접 지정

내부 스타일 시트 : 문서 앞부분에 문서에서 사용하는 스타일을 모아서 함께 정의하고 관리

외부 스타일 시트 : 문서에서 사용하는 스타일을 모아서 따로 파일로 저장한 후 연결해서 사용함.

 

<<<CSS 기본 선택자>>>

전체 선택자 : 문서의 모든 요소에 스타일을 적용함 ==> * { margin:0; }

타입 선택자 : 특정 태그를 사용한 모든 요소에서 스타일을 적용함 ==> p { font-style: italic; }

클래스 선택자 : 특정 부분만 선택해서 문서 안에 여러 번 적용 함. ==> .bg { background-color: #ddd; }

id 선택자 : 특정 부분만 선택해서 문서 안에서 한 번만 적용함 ==> #container { width : 500px; }

그룹 선택자 : 여러 요소에 같은 스타일을 적용할 때 사용함 ==> h1, h2 { text-align: center; }

 

<<<스타일 우선순위>>>

1. 얼마나 중요한가?

①사용자 스타일 → ②제작자 스타일 → ③브라우저 기본 스타일

 

2. 적용 범위는 어디까지인가?

①!important → ②인라인 스타일 → ③id 스타일 →④클래스 스타일 →⑤타입 스타일

 

3. 소스 작성 순서는 어디까지인가?

나중에 작성한 스타일이 먼저 작성한 스타일을 덮어씀