第二段字体颜色

源自：9-3 权值计算-特殊性

第二段字体颜色

p span{color:purple;}

在加入p span{color:purple;}权重为2，p{color:red;}权重为1，为什么第二段字体颜色还是red？

提问者：frsec 2016-12-13 10:15

个回答

慕的地8130322

2016-12-19 10:12:39

已采纳

p span{ color:purple} 和p>span{color:purple}是两个不同的意思，但是他们的权值都是2。
p span {}表示后代选择器而 p>span {}表示子代选择器
在这里的练习时显示的效果是一样的，但是意思有所不同

2

小刚0123456: 2016-12-13 11:38:55

p span{color:purple;} p span是p>span的缩写，只是对p中的子标签span起作用，p{color:red;} p标签的css样式才能对p起作用，所以显示的只是red，你添加一个span{color:red;}试试，肯定span中的文字显示成purple色,red不起作用，符合权重的规律。

我测试了是对的：

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>制作我的第一个网页</title>
        <style>
            p span{color:purple;}
            span{color:red;}
        </style>
    </head>
    <body>
        <h1>Hello World</h1>
        <p>sdfsadfasfasfa<span>sfasasa</span>fadfasfaf</p>
        <p>sdfasdfasdfadf</p>
    </body>
</html>

frsec

2016-12-13 10:44:07

就近原则怎么说

0
慕粉1728483858

2016-12-13 10:20:55

这里没有什么权重这一说法，只满足就近原则。

0