我将<div id="header">块更改为HTML5的<header>块时遇到了一个特殊的CSS格式问题。 基本上,我希望<header>块中的链接具有某种颜色,并且不进行任何修饰。

相关的HTML和CSS代码如下所示:

<!-- HTML5 code -->
<header>
    <h1>
        <a href="#">Link text</a>
    </h1>
</header>

/* CSS code */
header a {
    color: black;
    text-decoration: none;
}

我看到的输出(将Firefox 20.0与Ubuntu 12.04结合使用)好像上面的CSS代码片段不存在。

将类似class="hdr"到锚点并将CSS规则更改为a.hdr 也可以改回<div id="header">#header a 仍然,我不明白为什么仅使用<header>和相应的规则会失败,这使我感到“正确”的方法。

最初对解决方案的搜索将我带到了该链接 (我最初将<h1>块嵌套在<a>块内),但是使用<div>包装器也不起作用。

===============>>#1 票数:0

尝试更加具体。

<header class="main-header">

    <a href="#"><h1>Link Text</h1></a>

</header> <!-- .main-header -->


.main-header a {
    color: green;
    text-decoration: none;
}

===============>>#2 票数:0

使用

header h1 a {}

因为您的选择者应该解决您的特异性问题

否则,如果您的样式一旦被访问(通过a:visited选择器)就被覆盖,则可以编写具有相同特异性的样式,但是它将覆盖其他规则,因为它稍后会在层叠中出现

header a:visited {}

稍后在样式表中添加

顺便说一句,对不起,我不得不发表一个回答,因为我还不能发表评论

  ask by Sweeters translate from so

未解决问题?本站智能推荐: