html - 覆盖从父级继承的值

Question

我觉得这是一个很愚蠢的问题。我想让一个子元素与其父元素具有不同的样式。就像这个 JSFIDDLE例子。 id Logo 应为橙色。但是，由于 a 的样式，它目前为黑色。如何覆盖颜色并将其更改为橙色？

谢谢

html:

<p id="logo"><a href="#">LOGO</a></p>

CSS:

a {
text-decoration: none;
color: rgba(0,0,0,1.00);
}

#logo{
font-family: "Century Gothic";
font-weight: bold;
font-size:2.3em;
color: #FF9D00;
}

Answer 1

要么使用 #logo a 更明确地设置它，要么将 Logo 的颜色设置为 !important 这将防止它被更高的优先级覆盖:

color: #FF9D00 !important;

或

#logo a {
  color: #FF9D00;
}