温馨提示：这篇文章已超过239天没有更新，请注意相关的内容是否还可用！
CSS中的:target伪类选择器用于选择当前活动的目标元素。当页面中的锚点链接被点击时，目标元素会被选中，并且可以通过:target选择器来为其应用特定的样式。
例如，我们有一个包含两个锚点链接的页面，分别是#section1和#section2。当我们点击#section1链接时，页面会滚动到对应的目标元素，并且该目标元素会被选中。我们可以通过:target选择器来为选中的目标元素应用特定的样式。
下面是一个示例代码：
<!DOCTYPE html>
<html>
<head>
<style>
/* 定义目标元素的样式 */
:target {
background-color: yellow;
}
/* 定义锚点链接的样式 */
a {
display: block;
margin-bottom: 10px;
}
</style>
</head>
<body>
<a href="#section1">Go to Section 1</a>
<a href="#section2">Go to Section 2</a>
<div id="section1">
<h2>Section 1</h2>
<p>This is the content of section 1.</p>
</div>
<div id="section2">
<h2>Section 2</h2>
<p>This is the content of section 2.</p>
</div>
</body>
</html>
在上面的示例中，当我们点击#section1链接时，页面会滚动到id为section1的目标元素，并且该目标元素会被选中，背景颜色变为黄色。同样地，当我们点击#section2链接时，页面会滚动到id为section2的目标元素，并且该目标元素也会被选中。
除了为目标元素应用样式外，我们还可以使用:target选择器来为其他元素设置样式。例如，我们可以通过:target选择器来隐藏目标元素之外的其他元素，以突出显示当前活动的目标元素。
/* 隐藏目标元素之外的其他元素 */
div:not(:target) {
display: none;
}
上面的代码会将除当前活动的目标元素外的其他div元素隐藏起来。这样，当我们点击锚点链接时，只有对应的目标元素会显示出来，其他元素会被隐藏。
通过使用:target选择器，我们可以根据用户的操作动态地改变页面的样式，从而提升用户体验。我们可以结合使用:target选择器和其他CSS属性来实现更多的效果，例如改变字体颜色、大小、位置等等。
