p{color:red;}
span{color:pink;}/*设置为粉色*/
</style>
</head>
<body>
<h1>勇气</h1>
<p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
你应该这样理解:span继承p的color:red为红色的权值是0.1。而代码中span{color:pink}的权值为1。所以span内的元素根据权值大的color:pink。显示为粉色
样式跟继承没关系 代码加载从上到下 span的样式后加载 覆盖了前面相同权值的p
其实p跟span标签的权值是一样的 存在层叠效果就是说应该是span覆盖p的,而不是p覆盖span的。