Question

我正在使用下拉菜单，但我在从子菜单中删除某些样式时遇到问题。父元素有一个border-right: 1px，但我不希望孩子有任何边框，并将其设置为border: 0px并不做任何事情。有没有办法从某些东西中清除所有继承的样式？

编辑：好的，这里有一些我尝试过的代码：

＆＃13;

parent {
  border-right: 1px solid lightgrey;
   }

parent child {
  border: 0px 0px 0px 0px !important;
  }

＆＃13;

此时我想我只是创建一个新的ID来解决导致我的代码无法工作的问题。

第二次编辑：不，创建一个ID或类也没有工作。这段代码真的想要那个边框。。

第3次修改：好的，这里是jsfiddle。出于某种原因，list-style-type: none并不是在处理小提琴，但它适用于我自己的代码。。。怪异。

第4编辑： Ana指出了list-style-type的问题，我在复制代码时忽略了它。但边界问题仍然存在。我将颜色更改为红色，以便更容易看到。

最终编辑： Ana回答了！我是一个dum-dum并且将border: 0px应用于UL而不是它所属的IL。谢谢Ana！

Answer 1

尝试使用此功能仅将css应用于直接孩子

#parent > li

如果它被继承，请尝试使用！important来覆盖父css

Answer 2

添加！重要的样式。所以你的新css将是border：0px！important;

Answer 3

为了清除继承的样式，您必须通过对感兴趣的元素应用更具体的规则来覆盖规则。阅读“css特异性”

div {
    border: 1px solid red;
}


div.child {
    border: 0;
}