쇼핑몰 Q&A
자료실

 
레드샵 Tips
 
 [CSS/웹표준] CSS 적용 우선순위  REDBRUSH
링크


1. Style : style="coloer:red;"

2. ID : #type { color: red }

3. class : .contents { color:red }

4. 조건 : P B { color : red }

5. 타입 : B { color : red }

1번이 가장 높은 우선 순위를 가지고 있습니다. 즉 엘리먼트에 직접 스타일을 써놓은것이 우선적으로 적용됩니다..

만약 CSS가 상위의 다른 CSS와 충돌이 나서 문제가 생길때는 div, span 등을 넣어서

#id .class {}

와 같은 식의 조건을 주어 해당 엘리먼트의 적용우선순위가 높아지게 하면 어느정도 해결할 수 있습니다.

또한,

우선순위의 차이가 난다고 하더라도 하위에서 재정의한것이 아니면 상위의 있는 스타일이 적용되며 상위에서 text-align을 정의하고 하위에서 color를 적용하더라도 여전히 text-align은 적용이 됩니다. 스타일에 따라 다르지만 auto로 넣던지 아니면 다른 원하는 값을 주어서 재정의 해 주어야 합니다.

그리고 { color : red !important } 처럼 !important라고 적어주면 우선순위와 상관없이 적용하게 할 수 있습니다.

목록으로

Copyright