Specificity between not() and first-child selectors
Question
So we have the following example about not() and p:first-child{} selectors.Here is the example:
<!DOCTYPE html>
<html>
<head>
<style>
p:first-child{
color: red;
}
p:not(a){
color: green;
}
</style>
</head>
<body>
<p>This a paragraph.</p>
</body>
</html>
Why the paragraph is red at the end? Can somebody explain (if possible ) why the p:first-child{} has bigger specificity than not() selector???
1 answers
solution1
5 ACCPTED 2016-04-13 21:45:47
Can somebody explain (if possible ) why the p:first-child{} has bigger specificity than not() selector?
Because :not() doesn't have any influence on specificity itself – only what is inside it counts in regard to specificity.
So you have the element selector p and the pseudo class :first-child , which gives a specificity of 0-0-1-1 – and you have the element selectors p and a , which result in 0-0-0-2 .
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.