한 태그에 여러가지의 스타일이 적용되었을 때. 우선되는 순위


1. !importent

스타일을 적용 할 때. 최고의 우선순위를 가지고 싶을 때. 삽입하면 됨.

ex) color:#ffffff !importent


2. style 속성으로 삽입한 스타일

ex) <div style="background-color:#ffffff"></div>


3. id 선택자를 통해 삽입한 스타일

<style>

#box {

background-color:rgb(123,123,123);

}

<style>

4. class선택자를 통해서 삽입한 스타일

<style>

.chkbox {

background-color:rgba(123,123,123,0.3);

}

</style>


5. 태그 선택자를 통해 삽입한 스타일

<style>

div {

backgorund-color:skyblue;

}

</style>


6. 웹 브라우저 기본 스타일

웹 브라우저에서 기본적으로 적용되어 있는 스타일을 지정한다.

가장 쉬운 예로 a태그에 파란 글씨가 되고 밑줄이 그인다거나 하는 부분.




메모

2~6번 까지의 우선순위는 일반적으로 생각되는 범위가 가장 넓게 적용되는 순서로 우선순위를 가지는 경향으로 설계되어있다.


'프로그래밍 > CSS3' 카테고리의 다른 글

IOS를 위한 영문,숫자 폰트 지정  (1) 2019.04.16
[CSS3] 스타일우선 순위  (0) 2018.06.12
CSS Sprite(CSS 스프라이트)  (0) 2018.01.31
CSS3 스크롤바 스타일  (0) 2017.05.30
CSS3 display:inline-block시 가로 여백  (0) 2017.05.30
[CSS3] box-shadow (그림자 효과)  (0) 2017.04.21

댓글 작성