나는 CSS의 우선 순위를 연구 중이 었으며 다음을 포함하여 일부 기사를 읽었습니다. http://www.w3.org/TR/CSS2/cascade.html. 그에 따르면 클래스와 같은 속성은 의사 요소보다 우선 순위가 높습니다. 그러나, 간단한 테스트를했을 때 그 반대가 일어났습니다. 아래는, 내 코드 :CSS 우선 순위 이상한 동작
는 HTML :
는<ul>
<li class="item">Item</li>
</ul>
CSS :
ul li.item { font-size: 12px; }
ul li:first-letter { font-size: 20px; }
는 here를 참조하십시오. 클래스가 의사 요소보다 우선 순위가 높으면 첫 글자의 글꼴 크기가 20 픽셀 대신 12 픽셀을 갖는 이유는 무엇입니까? 미리 감사드립니다.
난 그냥 파이어 폭스에서 귀하의 바이올린을 봤는데, 당신은 문제가 없어, 제대로 작동합니다. 단어의 글꼴 크기는 12px입니다. 그러나 첫 번째 문자 의사 요소는 첫 번째 문자를 별도의 자격으로 식별하고 나머지 단어에 사용되는 스타일과는 다른 스타일을 지정하는 것입니다. 따라서 첫 글자의 특수성은 전체 단어의 특수성과 완전히 별개입니다. 그들은 서로를 무시하지 않습니다. 바이올린의 첫 글자가 정확하게 20px입니다.
자, 이제 알겠습니다. 이것은 다른 요소이기 때문에 발생합니다. 첫 글자는 리의 다른 요소입니다. 당신의 답변에 감사드립니다. – user3753202
나는 그 (것)들과 다른 성분다는 것을 함축하고 있지 않았다; 그들은 실제로 요소로 존재하지 않는다. 예를 들어 DOM에서 찾을 수 없습니다. 이것이 왜 가짜 요소라고 불리는 이유이며, 요소가 아닌 요소라는 단어를 사용한 이유입니다! 그것들은 실제 요소의 일부를 식별하는 수단 일 뿐이며 렌더링 엔진에게 그 부분에 다른 스타일을 적용하도록 알려줍니다. – GuyH
선택기 우선 순위는 CSS에서 가장 어려운 것 중 하나입니다. 그것을 배우려고하지 마십시오. =) 특정한 문제가있을 때 알아냅니다. – Rudie
내가 언급 한 기사에 따르면 첫 번째 선택기의 우선 순위는 0,0,1,2이고 두 번째 우선 순위는 0,0,0,3이라고 생각합니다. 따라서 첫 번째 선택기의 규칙이 적용될 것으로 예상했습니다 ... – user3753202
아마도이 도움이 될 수 있습니다 : http://stackoverflow.com/questions/19118036/same-specificity-after-taking-placement-into-consideration- first- letter-alway –