CSS


基本構文

span {font-size: 50px;}
- 선택자(selector), {속성(css) : 값(value);}

CSS宣言

[내장방식, 링크방식, 인라인방식, @import방식]

-내장방식 : <style><style>의 내용으로 작성
-인라인방식: 요소의 style속성에 직접 작성 ex)<div style="color:red;"></div>
-import방식 : @import 규칙으로 CSS 문서안에서 또 다른 문서를 가져와 연결
             EX) @import url("./box.css");

CSSセレクタ

[기본, 복합, 가상 클래스, 가상 요소, 속성]
- 기본 : 전체선택자 (*), 태그선택자 (ex: li, span, div), 클래스 선택자 (ex: .orange)
- 복합 : 일치선택자 (동시만족 ex: span.orange), 자식선택자 (ex: ul > li), 
		하위선택자 (ex: ul li), 인접형태 선택자 (다음 형제요소 ex: ul li+li), 
        일반형제 선택자 (다음형제 모두선택 ex: ul~li)
- 가상 : :hover, :active, :focus, first-child, last-child, nth-child(n), :not
- 가상요소 : ::before, ::after (가상요소 만들어 삽입, content:''; & add css)
- 속성 : ex): <input type="text" value="1234" disabled>
		 	 [disabled] { color: red;}
        	 <span data-fruit-name="apple">사과</span>
			 [data-fruit-name] {color: red;}
             
[선택자 우선순위]
- 인라인 선언 > id선택자(#) > class선택자(.), 태그선택자(div), 전체선택자(*)