# 우선 적용 규칙

## 케스케이드(Cascade) 규칙

* 여러 개의 CSS 파일을 결합할 때, 충돌을 해결하는 프로세스가 Cascade 이다. 

## **중요성 (Importance)**

* !important 선언은 다른 모든 선언보다 우선권을 가진다.
* !important 가 적용된 속성을 덮어 쓰려면. 다시 !important를 사용해야 하기에 최대한(절대!) 사용하지 않도록 노력해야 한다. 

## **특성 (Specificity)**

* 선택자의 우선권에 대한 척도
* 각 척도를 1, 10, 100, 1000 단위로 생각하면 이해하기 좋다.

```
    요소 선택자 < 클래스 선택자 < ID 선택자 < 인라인 스타일
     0,0,0,1    0,0,1,0     0,1,0,0     1,0,0,0
```

{% hint style="info" %}
\*, >, +, \~ 등 콤비네이터(Combinators) 또는 :not() 가상 클래스는 특성에 영향을 주지 않는다.
{% endhint %}

### 예시

```
*                           --0000
a                           --0001
a.link                      --0011
li:nth-child(2) a:hover     --0022
.nav:nth-child(2) a:hover   --0031
#outer a                    --0101
#outer #inner a             --0201
style="color: tan"          --1000
                            --important
```

## **소스 순서**

* 중요성, 특성이 설정되지 않았거나 동일한 경우 나중에 나온 소스의 스타일이 우선권을 가진다.

### 예시

```
p.note { color: #930212; }
p { color: #d5727e; } // 우선권을 가진다.
```

## 참고&#x20;

* [CSS 케스케이드(Cascade)](https://goo.gl/BAhjiN)
* [class 속성 개수가 11개면 id 속성 보다 우선할까요?](https://goo.gl/AkC2LN)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://shhn0509.gitbook.io/html-and-css/css-2/css-1/cascade.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.