Question

我想优先考虑<h1>。在我的示例中，我希望显示<h1> - 元素的背景，而不是为<a> - 元素指定的内容。

h1{
  background-color:blue1!important
}

但它在下面的上下文中不起作用：

<!DOCTYPE html>
<html>
<style>
a{
  background-color:red
}
h1{
  background-color:blue
}
</style>
<body>

<h1><a>My First Heading</a></h1>

<p>My first paragraph.</p>

</body>
</html>

我感谢任何帮助。

Answer 1

尝试：

h1 a,h1{
    background-color:blue
}

DEMO.

Answer 2

使用!important不是一个好习惯，因为你在样式表中打破了自然级联。只要您有机会不使用它，请不要使用它。

最具体的选择器始终获胜所以我建议您为id元素使用a。请查看this文章，了解css的特定规则。

示例：

a#special-link{
    background-color:red
}

<h1><a id="special-link">My First Heading</a></h1>

Answer 3

试试这个，

h1 a{
    background-color:blue !important;
    }

Answer 4

在CSS中，优先级意味着覆盖该属性。为此，我们可以使用

属性'！important'
引用父类，div等。

在这种情况下，我认为你想要全蓝色。

h1 a {
    background-color:blue;
}

Answer 5

I have read all the answers but I shall suggest to use child>combinator to get the proper result using css style rules.There may be a lot of <a> tag may be in <p> </p> tag .So your priority is to set only H1 tag so use the following rules.Don't break the css rules.

a{
  background-color:red;
}
h1>a,h1{
  background-color:blue;
}
</style>

Answer 6

如果你不打算使用它，你不需要（锚标记）如果这些都没有尝试改为

    <h1 style="background-color:blue;"> My First Heading </h1>

或将行更改为此

    <h1><a style="background-color:blue;">My First Heading</a></h1>

Answer 7

你应该在属性之后写!important，如下：

    .example{
    background-color:blue !important;
}

readmore

给CSS属性最高优先级

7 个答案: