CSS3:目标问题

Question

我有2个"链接",当我点击它们时必须得到一种颜色.但他们也需要在h1标签中.

像这样:

<div id="content" class="work">
    <h1 style="border-bottom:1px solid #CCC;"><a id="link-grafisk-design" href="#grafisk-design">Grafisk design</a></h1>
    <h1 style="border-bottom:1px solid #CCC;">&nbsp;/&nbsp;</h1>
    <h1 style="border-bottom:1px solid #CCC; width:276px"><a id="link-webbdesign" href="#webbdesign">Webbdesign</a></h1>
</div>

但是当我点击其中一个时,它不会改变颜色.
这是CSS

#webbdesign:target ~ #link-webbdesign {
    color:#00A2FF;
}

Answer 1

这不是:target为了什么.要设置您点击的链接样式,您应该使用h1 a:active.

h1 a:active {
     color:#00A2FF;
}

如果您希望更改的颜色持续到用户单击其他内容,则使用:

h1 a:focus,
h1 a:active {
    color: #00A2FF;
}

DEMO