javascript - 访问子元素时更改父项的颜色

Question

我正在尝试对具有多个子项的水平菜单项进行样式化。我的想法是在访问菜单的子项时更改父项和下拉菜单的颜色。我对 javaScript 不是很熟悉，所以我想征求意见 - 是否可以仅在 CSS 方法中执行此操作？

这是我的 HTML:

<ul class="gf-menu l1">
<li class="item128 parent">
 <a class="item" href"services">Services<span class="border-fixer"></span>::after</a>
<div class="dropdown columns-1">
<div class="column col1">
<ul class="l2">
<li class ="item1"><a class="item" href="submenu-01">Submenu1</a></li>
<li class ="item2"><a class="item" href="submenu-02">Submenu2</a></li>
<li class ="item3"><a class="item" href="submenu-03">Submenu3</a></li>
</ul>
</div>
</div>
</li>

还有 CSS:

.gf-menu .dropdown{
border: 1px solid transparent; 
border-radius:0; 
background-color:#a9a9a9; 
padding:10% 0; 
width:100%;
text-shadow:none;
font-size:85%;
.gf-menu.l1 li.item1.active.last {background-color:#abcf39;}
.gf-menu.l1 li.item2.active.last {background-color:#f39512;}
.gf-menu.l1 li.item3.active.last {background-color:#f16e68;}

如有任何帮助，我们将不胜感激，在此先感谢您!

Answer 1

您还不能使用 css 定位元素的父元素。 css 选择器级别 4 (CSS4) 通过使用“!”使这成为可能。在操作数上会出现这个特性。

你能做的恰恰相反。您可以使用伪“已访问”来定位智利元素并为其赋予特定颜色

.parent:visited .child {
    Attributes come here
}

使用 jQuery，您可以使用“.parent()”来定位父对象，我建议您对菜单使用这种方法。