[CSS] 가상 요소 선택자, css 속성, 선택자 우선순위

가상 요소 선택자 (인라인 글자요소)

ABC::before

선택자 ABC 요소 내부 앞에 내용을 삽입

ABC::after

선택자 ABC 요소 내부 뒤에 내용을 삽입

 

content:"" 라는 속성은 항상 추가 해야한다

 

속성선택자 

ATTR

[ABC] 

속성 ABC를 포함한 요소 선택

 

TTR=VALUE

[ABC="XYZ"]

속성 ABC를 포함하고 값이 XYZ인 요소 선택

 

CSS 속성

모두 글자/문자 관련 속성들!

(모든 글자/문자 속성은 아님 주의!)

 

font-style : 글자 기울기

font-weight : 글자 두께

font-size : 글자 크기

line-height : 줄 높이

font-famliy : 폰트(서체)

color : 글자 색상

text-align : 정렬

 

강제 상속

inherit;

부모요소로부터 강제적으로 상속 받아서 사용 할 수 있다.

 

선택자 우선순위

같은 요소가 여러 선언의 대상이 된 경우

어떤 선언의 css 속성을 우선 적용할지 결정하는 방법

1. 점수가 높은 선언이 우선함!

2. 점수가 같으면, 가장 마지막에 해석된 선언이 우선함

 

id 선택자 = #

class  선택자 = .

 

id 선택자 = 100점

class  선택자 = 10점

태그선택자 = 1점

전체 선택자 = 0잠

body 는 상속 되지 않음

인라인 선언 = 1000점

!important =  무한대 점수