在CSS3中，我们可以使用:active伪类结合过渡属性来实现一个“脉动效果”。

实现代码如下：

在线测试
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <style type="text/css">
        div
        {
            width:100px;
            height:100px;
            margin:100px auto;
            background-color:hotpink;
            transition:all 1s;
        }
        div:active
        {
            padding:200px;
        }
    </style>
</head>
<body>
    <div></div>
</body>
</html>

浏览器预览效果如下图所示。

效果

当我们点击div元素后，可以看到从小放大，然后再逐渐回归到原来的大小。很多小伙伴只知道:active伪类用于超链接，其实它可以用于任何元素，来定义一个元素被激活时的样式。

脉冲效果

效果