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（）”定位父级。我建议您使用该方法进行菜单。

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

1 个答案: