1. 스타일에서 가장 우선순위는 가장 마지막에 지정된 스타일.
2. 요소와 id > 요소와 클래스 > 요소 순으로 우선순위가 결정됨
<style type="text/css"> div { background:red } div.color { background:blue } div#bg { background:green } </style> <div id="bg" class="color"> 이경우 우선순위는 div#bg </div> 결과
1순위 div#bg 2순위 div.color 3순위 div |
3. "!important"를 선언한 스타일이 가장 먼저 적용됨.
<style type="text/css"> div { background:red } div.color { background:blue !important; } div#bg { background:green } </style> <div id="bg" class="color"> 이경우 우선순위는 div.color </div> 결과
1순위 div.color 2순위 div#bg 3순위 div |