CSS：除非定义了样式，否则如何向所有内容添加样式

Question

如果我添加样式：

* {
  font-size: 14px;
}

后来我定义了一个元素：

#myElement {
  font-size: 18px;
}

第一个将覆盖第二个。

有没有办法定义第一个，例如第二个会覆盖它，14px大小将应用于所有未定义大小的元素？

（我想替代使用类）

Answer 1

使用!important

#myElement {
  font-size: 18px !important;
}

值得注意的是，在您的示例中，如果您特定地在该元素上设置样式，无论是类还是ID，它都将继承属性，但它将覆盖任何特定样式。所以做上述事情是毫无意义的。这可以像这样说明：

<style type="text/css">
    * {
        font-size: 60px;
    }

    #blah2 {
        font-size: 14px;
    }
</style>

<span id="blah1">i'm default size</span>
<br/>
<span id="blah2">i'm specially 14px</span>

小提琴： http://jsfiddle.net/garreh/3YuLD/

Answer 2

元素#myElement将覆盖第一个规则，因为它更具体。如果#myElement有孩子，那么孩子将匹配全局选择器。尝试在body上设置规则。

Answer 3

不，第一个不会覆盖第二个。具有id的选择器比具有元素的选择器更具体，因此第二个将覆盖第一个。

要覆盖规则，您只需制定更具体的规则。只计算选择器中id，class和element说明符的数量，其中id是最具体的。

您可以在此处阅读有关选择器特异性的更多信息：
css.maxdesign.com.au/selectutorial/advanced_conflict.htm

Answer 4

第二条规则应该覆盖第一条规则。确保您的元素有id="myElement"。使用检查器（例如Firebug或Chrome的Web开发工具）查看被覆盖的元素应用的样式。