Disinherit(重置)特定元素的CSS样式？

Question

好吧,我有一个漂亮的网站,它的风格在CSS和一切

但是现在我发现了一个问题,我想要一个列表是处女,没有任何继承的风格.

我知道我可以做它只是给它一个style="(...)"所以它覆盖了继承的样式,但是,有没有任何指令/技巧/东西可以做到这一点吗？

Answer 1

在CSS层叠和继承级别3规范引入了对所有属性的一次复位能力.这是通过使用all具有值initial或unset取决于是否需要重置继承属性的简写属性来实现的.

请注意,这些与浏览器的默认值无关.

该功能适用​​于Firefox 27 +,Chrome 37+和Opera 24+.

在广泛实现该功能之前,您可以使用"命名空间"类.例如,要将布局样式与内容样式分开,content可以将类似的类用作所有内容样式的命名空间.

简化示例:

/* Global styles for UL lists. */
UL {list-style: none; margin: 0; padding: 0; }

/* Styles for UL lists inside content block. */
.content UL {list-style: disc; margin: 1em 0 1em 35px; }

Answer 2

这个问题最好的解决方法是从一开始就避免它。我尝试将上下文（或后代）选择器保持在最低限度，并且避免使用标签名称作为选择器。相反，我使用类，以便我的 html 元素（<a>、、<p><ul>、<span>等）将始终看起来像没有被设置样式，无论上下文/其父元素是什么。

就您而言，我认为您只能使用 inline-style 属性或!important更好地创建一个.reset类来覆盖您提到的继承样式：

.reset { with: auto; height: auto; padding: 0; /* etc */ }

上面提到的所有解决方案都有缺点，所以你需要选择你的战斗。