CSS 우선순위 | 데이터카페

CSS 우선순위
- CSS 우선순위는 스타일 규칙들이 서로 충돌할 때 어떤 규칙이 우선하여 적용되는지 결정하는 규칙입니다.
  코딩을 할때 동일한 명칭으로 처리 할수 있기때문에 우선순위를 알아야 합니다.

CSS 우선순위 점수
 - 점수가 높으면 가장 높은 우선순위로 반영 됩니다.
 1.!important (10000점)
 2.HTML 요소에 직접 적용된 스타일 (1000점)
 3.ID 선택자 (100점)
 4.클래스 선택자 (10점)
 5.태그 선택자 (1점수)

우선순위 설명 
!important 
 - 소스 속성안에 !important 선언하면 가장 높은 순위가 됩니다.
css
  div { color:black; !important; }


인라인 스타일 (inline style)  
 - HTML 요소에 직접 적용된 스타일은 다른 모든 스타일 규칙보다 우선합니다. 인라인 스타일은 style 속성을 사용하여 HTML 태그에 적용됩니다.
css
  <div sytle="color:black"></div>


ID 선택자 (ID selectors)  선언방법 : #id
- ID 선택자는 #으로 시작하며, 특정 HTML 요소에 고유한 식별자를 제공합니다. ID 선택자는 클래스나 태그 선택자보다 우선합니다.
css
 #codename {color: black;}


클래스 선택자 (class selectors) 선언방법 .class
- 클래스 선택자는 .으로 시작하며, 여러 개의 HTML 요소에 동일한 스타일을 적용할 수 있습니다. 클래스 선택자는 태그 선택자보다 우선합니다.
css
 .codename {color: black;}


태그 선택자 (tag selectors) element
- 태그 선택자는 HTML 요소의 태그 이름을 사용하여 스타일을 적용합니다. 태그 선택자는 가장 일반적인 선택자이므로, ID 선택자나 클래스 선택자보다 우선순위가 낮습니다.
css
 div {color: black;}