[CSS] ⭐ CSS Selectors(5) | Inline Styles(인라인 스타일) | !improtant

Inline Styles(인라인 스타일)

Inline Styles는 ID,class, 요소보다 더 명시적인 선택자이다. 별로 사용하지는 않지만 요소를 스타일링하는 하나의 방법이다.

   <button id="signup" style="color: crimson">Sign Up</button>

.html 코드 안에 적은 거지만 인라인 스타일은 되도록 사용하지 않는게 좋다. 스타일 시트에서 분리되어 혼란을 일으키기 때문이다. 

 

!important

!important 규칙은 개별 스타일 지정에 사용할 수 있는 선택자이다. 이것또한 되도록 사용하지 않는게 좋다. 

button {
    background-color: orangered !important;
}

특이도와 상관없는 선택자이다. 하지만 매우 명시적이다.  !important;를 붙여서 sign up의 색도 오렌지 컬러로 바뀌었다. (!important를 사용해서.. 코드 시스템이 망가져버린것이다..ㅋㅋ)

하지만 !important가 편리할때도 있다.

언제냐면! 통제할 필요가 없는 외부 라이브러리나 도구를 다룰 때

혹은 무언가를 바꾸거나 덮어쓰고 싶을때는 !imprtant를 사용하면 된다. 

 

인라인 스타일과 !important는 특이도를 무시하고 자동으로 우선하게 만들기때문에 되도록 안사용하는게 좋다.