定位具有相同类属性的列表中的嵌套元素

Question

我只是在学习CSS，而且似乎无法解决此问题。 HTML看起来像这样：

`<section class=”red”>
  <ul>
     <li class=”list-one”>item</li>
     <li class=”list-one”>item</li>
  </ul>
</section>
<section class=”red”>
  <ul>
    <li class=”list-one”>item</li>
    <li class=”list-one”>item</li>
  </ul>
</section>
<section class=”blue”>
  <ul>
    <li class=”list-one”>item</li>
    <li class=”list-one”>item</li>
  </ul>
</section>`

我正在尝试使用class属性为“ blue”的列表项作为目标/样式。我已经尝试过.blue {color：red}和.blue ul li {color：red}以及其他一些组合，但似乎无济于事。

Answer 1

我更改了报价。

<style>
.blue ul li {
  color:blue;
}

.red ul li {
  color:red;
}
</style>

<section class="red">
  <ul>
     <li class="list-one">item</li>
     <li class="list-one">item</li>
  </ul>
</section>
<section class="red">
  <ul>
    <li class="list-one">item</li>
    <li class="list-one">item</li>
  </ul>
</section>
<section class="blue">
  <ul>
    <li class="list-one">item</li>
    <li class="list-one">item</li>
  </ul>
</section>