绕过 CSS“通用选择器 * 重置”答案

【问题标题】：Bypass CSS "Universal Selector * Reset"绕过 CSS“通用选择器 * 重置”
【发布时间】：2014-06-09 19:38:36
【问题描述】：

我受委托为网站编写登录页面。

问题出在：原开发者在主 css 文件中添加了“Universal Selector * Reset”：

* { //Universal Selector '*' Reset
    margin: 0;
    padding: 0;
}

然后围绕它构建网站样式。

不幸的是，这需要大量代码来处理表格、列表、标题等。

问题是： 有没有办法绕过单个对象（表、列表等）甚至一般页面的选择器（除了不包括 css 文件）？

编辑：有些人对我的问题感到困惑。绕过我的意思是忽略星号选择器而不是覆盖它...另外请注意，我正在尝试最小化额外代码。

编辑 2： 这是一个 jsFiddle，它说明了我的问题。
注意：“填充：初始；”似乎没有工作。

【问题讨论】：

你为什么不直接使用table,list { margin: 1em; padding 1em;}？
您是否尝试过使用 * { margin: initial; padding: initial; } 之类的内容覆盖它？
不只是提供一个更具体的选择器吗？ table { margin: 10px; }。当然，重点是消除浏览器之间默认样式的差异。为什么你要恢复到我不知道的那种不一致的样式。
问题是你不能覆盖任何东西，还是你想要一个更好的方法来覆盖所有东西？
@BenA.Noone 我不是说initial 有效，事实上我试过了，我知道它在任何浏览器中都不起作用（至少对于填充）。以下是如何使用脚本忽略 * 规则 demo

【解决方案1】：

任何其他选择器比 * 选择器更具体，因此会覆盖它的效果。
请参阅以下sample Jsfiddle。

因此，例如，如果你想恢复

上的填充，你可以简单地做

table {
    padding: initial;
}

如果这不能满足您的要求，您可以微调您的星号选择器以忽略您选择的元素：

*:not(table) {
    [...]
}

附录：
对于许多人来说可能会出乎意料，设置一个属性，然后在其上使用更具体的选择器 initial 并不一定会反转设置。
比较 a reset to initial value (second image below) 和 an unstyled example (first image below)（取决于您的浏览器，结果可能会有所不同）：

无样式：

重置：

这是因为属性的the initial value（在 CSS 规范中定义）可能与您浏览器的元素默认值不同。

【讨论】：

【解决方案2】：

您不能取消（忽略）级联中已经存在的值；您必须修改引入该值的规则或用另一个值覆盖它。

* {
    margin: initial;
    padding: initial;
}

(Kudos King King) 将这些属性恢复为其初始值，但不会为这些元素重新应用浏览器的默认样式。（这些样式较早被覆盖并“丢失”。）但这是意料之中的。 :)

initial 是属性的“第一个”值，在应用任何规则之前。 每个属性都有一个在 CSS 规范中定义的初始值。

margin  = auto
padding = 0

浏览器的“默认”样式非常不同——它们是在作者样式表之前应用的实际样式规则。它们是为了模仿 CSS 之前的浏览器如何显示某些元素而编写的。

ul { padding-left: 40px; list-style: disc; … }

这些是任意的——对于列表的外观没有 CSS“默认值”。因此，如果您想要每个元素的默认值，最好使用write your own。

【讨论】：