CSS3文字抖动是一种很有趣的效果,可以增加网站的趣味性,如果大家对CSS3文字抖动感兴趣的话,那么可以通过以下代码实现文本抖动。 h1 { animation: shake 0.82s cubicb...
CSS3文字抖动是一种很有趣的效果,可以增加网站的趣味性,如果大家对CSS3文字抖动感兴趣的话,那么可以通过以下代码实现文本抖动。
h1 {
animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
}
@keyframes shake {
10%, 90% {
transform: translate3d(-1px,0,0);
}
20%, 80% {
transform: translate3d(2px,0,0);
}
30%, 50%, 70% {
transform: translate3d(-4px,0,0);
}
40%, 60% {
transform: translate3d(4px,0,0);
}
} 这段代码将CSS3属性应用在h1元素上,看起来非常简单。将文本抖动设置为一个'动画',并将其应用在元素上。
CSS3文字抖动是一种简单但有趣的效果。大家可以使用上面的代码实现它,或者通过其他在线工具来创建自己的CSS3文字抖动效果。