p1,span{color:green;}-慕课网

p1,span{color:green;}

来源：8-10 给选择器分个组 - 分组选择器

夕酉

2016-07-30 14:27

这样也可以出结果，会不规范吗

<style type="text/css">
h1,span{color:red;}
p1,span{color:green;}
</style>
</head>
<body>
    <h1>勇气</h1>
    <p1 class="first">三年级时，

写回答关注

9回答

qq_miaomiaodoub_0

2016-07-30 14:51:28

已采纳

我去看了他们的笔记，果然不错，转来给你看一下：
1. 我们需要做的是什么？
是将“第一段话”与“第二段中的【简单】”变为绿色。
2. 我们先拆分为两个问题
如何将第一段变为绿色？
如何将第二段中的简单变为绿色？
3. OK，我们先解决2中的第一个问题，在之前学习的知识中，我们是如何把一段文字变为绿色的呢？
步骤一：写一个css样式，我们写一个【.first ｛ color：green；｝】
步骤二：用<p>标签标出整段文字，并在<p>中加入class="first",如<p class="first">---------原代码中已经帮我们写好了。
完成。
那么又如何将简单两字变为绿色呢？
最简单的方式：span{ color :red},在用span标签标出简单两字。
但是，我们可以刚刚学习了后代选择器呀骚年，不想用用吗？
#second span{ color:green }搞定！（所有ID选择器名为second的标签中的所有span的所有后代标签都会受影响，包括span）

分组选择符的定义是什么？为多个标签元素设置同一个样式！这样省事简单，还可以减少代码冗余量。

所以我们将这两个问题合为一个处理：
.first , #second span{ color:green;},其余问题（如用合适标签括出要修饰的内容并加上class/ID=“...”）原代码中都已经帮我们做好了，所以我们需要做的仅仅是修改内嵌的css样式而已。

5 0

qq_mia... 回复夕酉

使用#second span{ color :green}，胆小如鼠会显示红色，因为这里用的是后代选择符，且span仅仅是特指id选择器second中的span。如果你是想让第一段全部变为绿色，需要加上 .first，即： .first，#second span{color:green;} 然后去掉原代码中的h1,span{color:red;}，原因如下：未去掉h1,span{color:red;}时，因该css样式权值为1，大于.first中span的权值（继承自.first，权值低，为0.01），所以会显红色。

2016-08-03 23:13:46

共 5 条回复 >
慕移动9181930

2022-03-25 05:17:40

这是MOOC的一般性规则。没人知道么 .0

0 0
qq_霁雨初晴_03739505

2016-07-30 15:01:07

是正确的，p1设置了属性是绿色的。因为没有设置first类的属性，所有应用了p1的属性。

0 0
qq_miaomiaodoub_0

2016-07-30 14:48:45

使用类选择器

0 0
qq_miaomiaodoub_0

2016-07-30 14:47:29

.first,span{color:green;}

0 0
SerDavos

2016-07-30 14:40:55

咦。。<p/>表示html段落标签啊。。<p1>标签是啥。。，css找的话也能找到p1，然后把样式换了吧，所以看出来的样式跟答案是无误的，但是p1不是段落标签啊。。。。

0 0
宝慕林5985537

2016-07-30 14:37:44

在权值相同的情况下，css样式与被设置标签就近显示，所以浏览器中显示出来的颜色是绿色

0 0
weibo_郑远飏_03751311

2016-07-30 14:37:13

当然不规范了，p标签是表示段落的，你的p1的话别人怎么可能知道是什么意思

0 0
qq_午夜彳亍_03393831

2016-07-30 14:34:45

正确的 span 是green的就近吗

0 0