如果URL中的片段标识符（哈希）引用它，则更改元素的样式

Question

如果URL中的片段标识符（哈希）引用它，那么在纯CSS中是否有一种方法可以更改元素的样式？

即

鉴于此HTML：

<p id="reference">lorem ipsum</p>

这个网址：

http://example.com/#reference

浏览器将滚动到ID为reference的段落，但是我可以在没有JavaScript的情况下更改该元素的样式吗？

我以为我可以用:focus psuedo-class做到这一点，但它没有用。另外3个处理鼠标事件（:hover，:active）和网址（:visited），因此这些都不起作用。

Answer 1

只使用CSS轻松完成，无需JavaScript。使用:target pseudo-class selector：

p#reference:target{background-color:gold;}

<p id="reference">lorem ipsum</p>
<a href="#reference">to target</a>
<a href="#">untarget</a>

另外read MDN用于浏览器支持（IE9 +）和其他信息。

Answer 2

在合理的支持下，应该有一个:target selector可以做到这一点。