Question

我有一个无序列表，里面有一个嵌套列表。我有一个活跃的风格，当链接活跃（duh），但我遇到的问题是我的电子服务＆＃34;是活跃的但由于某种原因，活跃的颜色已经应用于它的（ul）儿童。我似乎无法摆脱它。

我如何制作它只适用于一个电子服务链接？

.left-cnt ul ul{display:none;}
.left-cnt ul.left-menu{width:85%; padding-bottom:15px;}
.left-cnt ul.left-menu>li.active a{color:#18ab4f; font-weight:500;}
.left-cnt ul.left-menu>li.active {background: url("images/bullet.png") no-repeat scroll left 6px rgba(0, 0, 0, 0);}
.left-cnt ul.left-menu>li:hover ul{display:block;}
.left-cnt ul li{line-height:20px;}
.left-cnt ul a{color:#7b7d7e; font-size:16px; line-height: 25px;}
.left-cnt ul li:hover>a{color:#18ab4f;}
.left-cnt ul li:hover{background: url("images/bullet.png") no-repeat scroll left 6px rgba(0, 0, 0, 0);}

Answer 1

使用direct child combinator定位作为li.active直接子元素的锚元素。

因此，改变

.left-cnt ul.left-menu > li.active a

为：

.left-cnt ul.left-menu > li.active > a

Updated Example

.left-cnt ul.left-menu > li.active > a {
    color:#18ab4f;
    font-weight:500;
}

嵌套的无序列表从父级获取样式

1 个答案: