我可以重置一个CSS属性，而不是覆盖它？

我正在处理的网页已经有一些基本的样式表，其中一个包含这个规则：

address:not(:last-child), fieldset:not(:last-child), li:not(:last-child), ol:not(:last-child), p:not(:last-child), table:not(:last-child), ul:not(:last-child) {margin-bottom: 12px} 

这是在我的<p class="mainCopy">标签上应用12px的margin-bottom，我不感兴趣，我希望能用.mainCopy {margin-bottom: 0}覆盖它，但显然基本规则比我的规则更具体。 这迫使我做一个比我想要或需要更具体的规则，比如p.mainCopy 。 此外，我有时需要<li class="mainCopy"> ，这将迫使我添加第二条规则，以迎合<li> 。

有什么办法可以简单地重置这个属性，或者还原有问题的CSS声明？

Answer 1

回答你的问题（而不是解决你的问题）…

我可以重置一个CSS属性，而不是覆盖它？

重置为什么？

CSS中的C代表级联，并且总是有几层样式，它们之间有精确的定义，但并不总是立即清晰的规则。 除了网站作者在不同地方（外部CSS文件， <style> blocks， style="" attributes …）设置的样式外，在基线中，我们将find内置的浏览器样式，据我所知浏览器供应商可以自由地分配他们select的任何默认样式 – 而且通常用户可以将自己的样式添加到汤中，无论是内置设置还是附加组件。 即使是所谓的CSS重置也不会重置任何东西。 他们只是在其余的上面再增加一层样式。

没有“在这里创build一个快照”的语法（如果没有一个彻底的分析，这将是我能想到的唯一的解决scheme），所以答案基本上不是 。

Answer 2

由于address:not(:last-child)和类似者有11点的特殊性，所以你可以复制类名来使它更强。 例如，下面的声明是完全有效的，它具有20点特异性：

 .mainCopy.mainCopy { margin-bottom: 0; } 

你必须在你的html中只添加一个mainCopy ：

 <ul class="mainCopy"> 

编辑

注意特异性的“点”，因为没有小数点。 他们是由特异性的数字位置。 例如：

  address:not(:last-child) /* is 0-0-1-1 specificity (1 tagname, 1 pseudoclass) */ .mainCopy.mainCopy /* is 0-0-2-0 specificity (2 classnames) */ 

Answer 3

存在以下属性：

 all: unset; 

我相信可以这样使用：

 .mainCopy { all: unset; margin-bottom: 0 } 

https://developer.mozilla.org/en/docs/Web/CSS/unset

编辑：其实我相信由于您的具体问题的具体情况，这可能无法正常工作。

Answer 4

您可以添加另一个：不规则到所有您想排除的select器.mainCopy有余量

 address:not(:last-child):not(.mainCopy), fieldset:not(:last-child):not(.mainCopy), li:not(:last-child):not(.mainCopy), ol:not(:last-child):not(.mainCopy), p:not(:last-child):not(.mainCopy), table:not(:last-child):not(.mainCopy), ul:not(:last-child):not(.mainCopy) { margin-bottom: 12px } 

Answer 5

使用通用select器 *以body标记开头。

 body *.[<'className'>] {} 

---

或者简单地在你的课堂上加上body标签。

 body .[<'className'>] {} 

---

两者实际上是相同的，使用你认为合适的和/或更易于检测的维修点。

---

 address:not(:last-child), fieldset:not(:last-child), li:not(:last-child), ol:not(:last-child), p:not(:last-child), table:not(:last-child), ul:not(:last-child) { margin-bottom: 12px; color: red; } body *.mainCopy { margin-bottom: 0; color: green; } 

 <main> <p class="mainCopy">p</p> <p>p</p> <ul> <li class="mainCopy"> li </li> <li> li </li> </ul> <code>body *.mainCopy {}</code> </main> 

Answer 6

我倾向于最初的财产价值。

 address:not(:last-child), fieldset:not(:last-child), li:not(:last-child), ol:not(:last-child), p:not(:last-child), table:not(:last-child), ul:not(:last-child) {margin-bottom: initial}