介绍
本篇内容主要讲解“CSS3怎么实现文字抖动效果”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“CSS3怎么实现文字抖动效果”吧!
基础说明
文本阴影:X轴Y轴模糊颜色;
四个参数分别为X轴、Y轴,阴影模糊大小,阴影颜色。可以设置多个阴影效果。
举例
1,没有给其X轴与Y轴设置值,所以会发生在本身。
文本阴影
2, X轴与Y轴改变了正值,正值X轴向右,正值Y轴向下。
文本阴影
3, X轴与Y轴改变了负值、负值X轴向左,负值Y轴向上。
文本阴影
4,多参数
文本阴影
跳起来
代码
@keyframes animate-my {
0% {
文本阴影:0 1 px 0 # d8d8d8,
0 2 px 0 # d8d8d8,
0 3 px 0 # d8d8d8;
变换:translateY (0);}
50% {
文本阴影:0 1 px 0 # d8d8d8,
0 2 px 0 # d8d8d8,
0 3 px 0 # d8d8d8,
0 10 px 5 px红色;
变换:translateY (-20 px);}
100% {
文本阴影:0 1 px 0 # d8d8d8,
0 2 px 0 # d8d8d8,
0 3 px 0 # d8d8d8;
变换:translateY (0);}
}
到此,相信大家对“CSS3怎么实现文字抖动效果”有了更深的了解,不妨来实际操作一番吧!这里是网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!