Css 선택기 가중치 문제
876 단어 프런트엔드
HTML+CSS를 이용하여 사이트를 개발할 때 CSS의 선택기는 여러 가지가 있는데 예를 들면 줄 스타일, ID 선택기,class류 선택기, 라벨 선택기 등이다. 그러나 한 라벨이 여러 가지 선택기를 포함할 때 어떤 선택기가 작용하는지 우리는 모두 알고 있다.
예를 들면 다음과 같습니다.
CSS
만약 이렇다면 코드의 DIV 라벨은 도대체 어떻게 보여야 합니까?정답은 400px에 400px를 곱한 빨간색 정사각형입니다. 왜 그런지 잘 모르실 수도 있습니다. 다음은 모든 선택기의 중요성을 보여 드리겠습니다.
선택기 가중치!important Infinity 줄 스타일 1000id 100class/속성/위조 10 태그/위조 요소 1 어댑터 0
이 CSS 권중표에서 알 수 있듯이 important의 권중이 가장 크고 Infinity로 무한대임을 나타낸다. 그러나 어댑터 선택기가 가장 작고 0이다. 위의 예에는 important, 라벨, id,class,행간 양식이 있기 때문에 이 CSS 권중표에 따라 어느 css 선택기의 속성을 보여야 하는지 알 수 있다.