target译为“目标”，加冒号即为伪类选择器。
此选择器便是用于给目标元素添加额外样式，类似于hover。

使用

该选择对应的目标元素为锚点触发。
以下代码定义了两个a元素，其中一个为链接元素，另一个使用样式定义为块元素。
块元素设置了透明度为0，并设置其被链接时透明度为1和过度效果。
最终的效果为点击链接元素时，div1从透明到不透明过度。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>target选择器</title>
<meta name="renderer" content="webkit">
<style>
    .link {
        display: block;
        text-decoration: none;
        text-align: center;
        color: #fff;
        background: #ff0000;
        line-height: 30px;  
    }
    .a-block {
        display: block;
        opacity: 0;
    }
    .a-block:target {
        opacity: 1;
        transition: all .3s;
    }
</style>
</head>
<body>
    <a href="#div1" class="link">显示</a>
    <a id="div1" class="a-block">
        :target选择器可用于当前活动的target元素的样式。
        :target选择器可用于当前活动的target元素的样式。
        :target选择器可用于当前活动的target元素的样式。
        :target选择器可用于当前活动的target元素的样式。
        :target选择器可用于当前活动的target元素的样式。
        :target选择器可用于当前活动的target元素的样式。
        :target选择器可用于当前活动的target元素的样式。
    </a>
</body>
</html>

注意

起初我写下这段Demo时目标元素是用的div，后来发现该选择器不能像:hover一样作用于a以外的元素。
另外该选择器的兼容性为IE8以上（不包括IE8）。

适用场景

结合这个Demo可以发现该选择器又一次实现之前需要JS才能实现的功能，比如点击链接显示元素。
另外在全屏滚动动画页面时也可以用在导航之上，比如点击导航给对应的块添加动画效果。
更多使用方法也待慢慢摸索了！