Html CSS选择属性

假设evergreen、fruit和leaf类未在页面的其他位置使用。什么选择器会选择苹果树，但不会选择其他树

<ul id="forest">
 <li class="evergreen"><a>pine</a></li>
 <li class="evergreen"><a>lodgepole</a></li>
 <li class="evergreen fruit"><a>holly</a></li>
 <li class="leaf fruit"><a>apple</a></li>
 <li class="leaf"><a>oak</a></li>
 <li class="leaf"><a>maple</a></li>
</ul>

松树
lodgepole酒店
冬青
苹果
橡树
枫树

这样做可以：

li[class=“叶果”]{
颜色：红色；
}

松树
lodgepole酒店
冬青
苹果
橡树
枫树

您可以这样选择苹果树：

#forest .leaf.fruit {
    font-weight: bold;
}

但也许您可以使用更具体的类名来使用CSS进行选择：

ul#forest li.leaf.fruit a{
   color: red;
}

安全的方法是同时参考

ul

：

#forest>.leaf.fruit{

这仅在这种情况下有效，因为您没有同时指定了

叶

和

果

类的元素

CSS的其他选项： 据

如果将标记更新为：

要选择文本为apple

的节点，可以使用：

li[fruit*='apple']{
  background-color:red;
}

替代溶液

li:not(.evergreen).fruit

.叶子.水果

---

这是edx css选择器的答案这是正确的答案

#forest.leaf.fruit？是否还会有另一个

class=“leaf-fruit”？你到目前为止尝试什么？请检查并欢迎另一个问题，<代码> > LI> < /代码>更改吗？这是某种作业吗？为什么使用“<代码>类>代码>属性选择器，如果你只能使用<代码> LI.Lo.Buto.<代码>，请先检查其他ANSER，并考虑添加一些文本，这解释了你的任务。解决方案
li:not(.evergreen).fruit