为了账号安全,请及时绑定邮箱和手机立即绑定

CSS选择器的权重与优先规则 如果像我这样写为什么显示的都是红色而不是粉红色,根据分析p语句时span继承为0.1 后面一句为span标签为1,应该显示粉红色才对,求解

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>特殊性</title>

<style type="text/css">

p{color:red;}

/* .first{color:green;}/*因为权值高显示为绿色*/  */


span{color:pink;}/*设置为粉色*/


/*p span{color:purple;}*/

</style>

</head>

<body>

    <h1>勇气</h1>

    <p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>

    <p id="second">到了三年级下学期时,我们班上了一节公开课,老师提出了一个很简单的问题,班里很多同学都举手了,甚至成绩比我差很多的,也举手了,还说着:"我来,我来。"我环顾了四周,就我没有举手。</p>

</body>

</html>


正在回答

5 回答

/*     */这个中间放的是文字内容或者是你需要注意的地方,不会显示出来,但是你把.first{color:green;}和p span{color:purple;}放进去就不会显示出来成为了提示效果,这样是不对的,所以应该去除这2处的/*  */      这是你的错误所在

关于你提到的问题,胆小如鼠因为继承应该是绿色,就是把span{color:pink;}删除后的结果;这时候胆小如鼠的权值就不是.first的10,而是继承的0.1。然后添加上span{color:pink;},因为span的权值为1,比继承的0.1大,所以显示为粉色。这是继承的问题,好好看看继承那节~

1 回复 有任何疑惑可以回复我~
#1

慕九州7538876 提问者

嗯啦 谢谢大神们 把/* .first{color:green;}/*因为权值高显示为绿色*/ */删调之后就正常了 不知道为什么外围的注释没有用
2016-10-10 回复 有任何疑惑可以回复我~
/* .first{color:green;}/*因为权值高显示为绿色*/  */

这个地方出了问题,外围的注释‘*/’不知道什么原因并没起到作用,就把你的span{color:pink;}语句注释掉了;

把上边那行删去就可以了,你试试。

0 回复 有任何疑惑可以回复我~
#1

慕九州7538876 提问者

恩 是的 我把那段删掉之后就正常了 谢谢
2016-10-10 回复 有任何疑惑可以回复我~

因为span继承了p ,所以span的权值为0.1,而p为1.

所以显示红色。

0 回复 有任何疑惑可以回复我~
#1

慕九州7538876 提问者

p{color:red;} span{color:pink;}/*设置为粉色*/ 如果这样写是会显示粉红色的 中间试了很多次 感觉了解更深了点
2016-10-10 回复 有任何疑惑可以回复我~

你的提问已经回答了你的问题了呀!因为span是p的子元素,所以它只有一个继承权值,也就是0.1!不会再有第二个权值了.

0 回复 有任何疑惑可以回复我~
#1

慕九州7538876 提问者

嗯啦 懂了 程序刚刚改的时候也有点问题 现在解决了 谢谢
2016-10-10 回复 有任何疑惑可以回复我~

http://img1.sycdn.imooc.com//57fb12c50001178813540190.jpg

我这里显示“胆小如鼠”是粉红色的,没有问题

0 回复 有任何疑惑可以回复我~
#1

慕九州7538876 提问者

已经解决 谢谢so nice的你们哈哈
2016-10-10 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

CSS选择器的权重与优先规则 如果像我这样写为什么显示的都是红色而不是粉红色,根据分析p语句时span继承为0.1 后面一句为span标签为1,应该显示粉红色才对,求解

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信