Question

我正在制作一个超级下拉菜单，对于主菜单，我有一个下面列出的某种风格，但我希望这种风格只适用于第一个主菜单列表。我不希望它应用于mega下拉菜单中的任何列表是否有一种方法可以在子列表中覆盖这些样式？

#main-nav ul li {
width: 12.5%;
float: left;
text-align: center;
line-height: .9em;
font-weight: bold;
border-left: 2px solid #33363b;
background: #25272a;
border-radius: 4px;
}

#main-nav ul li a {
display: block;
color: #FFF;
line-height: 12px;
font-size: 14px;
padding: 22px 0;
text-decoration: none;
}

#main-nav ul li a:hover {
text-decoration: none;
color: #3B8DBD;
cursor: pointer;
background: #191a1c;
}

Answer 1

试试这个，

#main-nav > ul > li {
width: 12.5%;
float: left;
text-align: center;
line-height: .9em;
font-weight: bold;
border-left: 2px solid #33363b;
background: #25272a;
border-radius: 4px;
}

#main-nav > ul > li > a {
display: block;
color: #FFF;
line-height: 12px;
font-size: 14px;
padding: 22px 0;
text-decoration: none;
}

#main-nav > ul > li > a:hover {
text-decoration: none;
color: #3B8DBD;
cursor: pointer;
background: #191a1c;
}

如何使风格不适用于儿童元素？

1 个答案: