html涟漪特效,css3点击显示涟漪特效

css3点击显示涟漪特效，怎样用css3做出点击显示涟漪特效，点击显示涟漪的特效需要注意哪些方面？下面给大家做一个案例.

css3点击出现不同颜色涟漪特效

/* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */

.ripple{

position:absolute;

width:100vmax;

height:100vmax;

top:-50vmax;

left:-50vmax;

border-radius:50%;

}

body{

overflow:hidden;

}

.pad{

position:absolute;

left:0;

right:0;

top:0;

bottom:0;

}

Css部分：

.ripple{

position:absolute;

width:100vmax;

height:100vmax;

top:-50vmax;

left:-50vmax;

border-radius:50%;

}

body{

overflow:hidden;

}

.pad{

position:absolute;

left:0;

right:0;

top:0;

bottom:0;

}

Css3点击显示涟漪特效就这么多了，更多精彩请关注php中文网其它相关文章！

相关阅读：