我正在try 将字体 colored颜色 仅应用于安莉组件中的第一个链接.
当单击li组件时，它的类为"Open".
为了实现这一点，我try 使用li a:First-of-type和li a:First-Child psuedo类，但不幸的是，该 colored颜色 适用于li中的所有子元素，如下所示:
如何使用css只为第一个子对象上色？
li.open a:first-of-type {
color: blue !important;
}<ul>
<li>
<a href="#">Section 1</a>
<ul class="off-canvas__nav-sub">
<li><a href="#">Sub page 1</a></li>
<li><a href="#">Sub page 2</a></li>
<li><a href="#">Sub page 3</a></li>
</ul>
</li>
<li class="open">
<a href="#">Section 2</a>
<ul class="off-canvas__nav-sub">
<li><a href="#">Sub page 1</a></li>
<li><a href="#">Sub page 2</a></li>
<li><a href="#">Sub page 3</a></li>
</ul>
</li>
<li>
<a href="#">Section 3</a>
</li>
<li>
<a href="#">Section 4</a>
</li>
<li>
<a href="#">Section 5</a>
</li>
</ul>