diff options
| author | outtime <i@timewk.cn> | 2019-12-19 13:48:42 +0800 |
|---|---|---|
| committer | outtime <i@timewk.cn> | 2019-12-19 13:48:42 +0800 |
| commit | 467366b3788943eefbbd0c18fabbe23ac5692376 (patch) | |
| tree | e6690c99c293961fd25305891754a89de12e7813 /assets/css/main/special.css | |
| parent | 71ff6eadc03c481acf0088b61eb14b79160e7d37 (diff) | |
🍭Add：添加蹦跶的颜文字与建站时间项，同时优化了部分代码
Diffstat (limited to 'assets/css/main/special.css')
| -rw-r--r-- | assets/css/main/special.css | 249 |
1 files changed, 249 insertions, 0 deletions
diff --git a/assets/css/main/special.css b/assets/css/main/special.css index 6b3c342..1ae2867 100644 --- a/assets/css/main/special.css +++ b/assets/css/main/special.css @@ -243,4 +243,253 @@ iframe[src*="//player.bilibili.com/player.html"] { }
.fadein {
opacity: 1;
+}
+/*底部动画字符*/
+.anime-face {
+ animation: anime-face 5s infinite ease-in-out;
+ display: inline-block;
+ margin: 0 5px;
+}
+@-webkit-keyframes anime-face {
+ 2%,24%,80% {
+ -webkit-transform: translate(0,1.5px) rotate(1.5deg);
+ transform: translate(0,1.5px) rotate(1.5deg)
+ }
+
+ 4%,68%,98% {
+ -webkit-transform: translate(0,-1.5px) rotate(-.5deg);
+ transform: translate(0,-1.5px) rotate(-.5deg)
+ }
+
+ 38%,6% {
+ -webkit-transform: translate(0,1.5px) rotate(-1.5deg);
+ transform: translate(0,1.5px) rotate(-1.5deg)
+ }
+
+ 8%,86% {
+ -webkit-transform: translate(0,-1.5px) rotate(-1.5deg);
+ transform: translate(0,-1.5px) rotate(-1.5deg)
+ }
+
+ 10%,72% {
+ -webkit-transform: translate(0,2.5px) rotate(1.5deg);
+ transform: translate(0,2.5px) rotate(1.5deg)
+ }
+
+ 12%,64%,78%,96% {
+ -webkit-transform: translate(0,-.5px) rotate(1.5deg);
+ transform: translate(0,-.5px) rotate(1.5deg)
+ }
+
+ 14%,54% {
+ -webkit-transform: translate(0,-1.5px) rotate(1.5deg);
+ transform: translate(0,-1.5px) rotate(1.5deg)
+ }
+
+ 16% {
+ -webkit-transform: translate(0,-.5px) rotate(-1.5deg);
+ transform: translate(0,-.5px) rotate(-1.5deg)
+ }
+
+ 18%,22% {
+ -webkit-transform: translate(0,.5px) rotate(-1.5deg);
+ transform: translate(0,.5px) rotate(-1.5deg)
+ }
+
+ 20%,36%,46% {
+ -webkit-transform: translate(0,-1.5px) rotate(2.5deg);
+ transform: translate(0,-1.5px) rotate(2.5deg)
+ }
+
+ 26%,50% {
+ -webkit-transform: translate(0,.5px) rotate(.5deg);
+ transform: translate(0,.5px) rotate(.5deg)
+ }
+
+ 28% {
+ -webkit-transform: translate(0,.5px) rotate(1.5deg);
+ transform: translate(0,.5px) rotate(1.5deg)
+ }
+
+ 30%,40%,62%,76%,88% {
+ -webkit-transform: translate(0,-.5px) rotate(2.5deg);
+ transform: translate(0,-.5px) rotate(2.5deg)
+ }
+
+ 32%,34%,66% {
+ -webkit-transform: translate(0,1.5px) rotate(-.5deg);
+ transform: translate(0,1.5px) rotate(-.5deg)
+ }
+
+ 42% {
+ -webkit-transform: translate(0,2.5px) rotate(-1.5deg);
+ transform: translate(0,2.5px) rotate(-1.5deg)
+ }
+
+ 44%,70% {
+ -webkit-transform: translate(0,1.5px) rotate(.5deg);
+ transform: translate(0,1.5px) rotate(.5deg)
+ }
+
+ 48%,74%,82% {
+ -webkit-transform: translate(0,-.5px) rotate(.5deg);
+ transform: translate(0,-.5px) rotate(.5deg)
+ }
+
+ 52%,56%,60% {
+ -webkit-transform: translate(0,2.5px) rotate(2.5deg);
+ transform: translate(0,2.5px) rotate(2.5deg)
+ }
+
+ 58% {
+ -webkit-transform: translate(0,.5px) rotate(2.5deg);
+ transform: translate(0,.5px) rotate(2.5deg)
+ }
+
+ 84% {
+ -webkit-transform: translate(0,1.5px) rotate(2.5deg);
+ transform: translate(0,1.5px) rotate(2.5deg)
+ }
+
+ 90% {
+ -webkit-transform: translate(0,2.5px) rotate(-.5deg);
+ transform: translate(0,2.5px) rotate(-.5deg)
+ }
+
+ 92% {
+ -webkit-transform: translate(0,.5px) rotate(-.5deg);
+ transform: translate(0,.5px) rotate(-.5deg)
+ }
+
+ 94% {
+ -webkit-transform: translate(0,2.5px) rotate(.5deg);
+ transform: translate(0,2.5px) rotate(.5deg)
+ }
+
+ 0%,100% {
+ -webkit-transform: translate(0,0) rotate(0);
+ transform: translate(0,0) rotate(0)
+ }
+}
+
+@keyframes anime-face {
+ 2%,24%,80% {
+ -webkit-transform: translate(0,1.5px) rotate(1.5deg);
+ transform: translate(0,1.5px) rotate(1.5deg)
+ }
+
+ 4%,68%,98% {
+ -webkit-transform: translate(0,-1.5px) rotate(-.5deg);
+ transform: translate(0,-1.5px) rotate(-.5deg)
+ }
+
+ 38%,6% {
+ -webkit-transform: translate(0,1.5px) rotate(-1.5deg);
+ transform: translate(0,1.5px) rotate(-1.5deg)
+ }
+
+ 8%,86% {
+ -webkit-transform: translate(0,-1.5px) rotate(-1.5deg);
+ transform: translate(0,-1.5px) rotate(-1.5deg)
+ }
+
+ 10%,72% {
+ -webkit-transform: translate(0,2.5px) rotate(1.5deg);
+ transform: translate(0,2.5px) rotate(1.5deg)
+ }
+
+ 12%,64%,78%,96% {
+ -webkit-transform: translate(0,-.5px) rotate(1.5deg);
+ transform: translate(0,-.5px) rotate(1.5deg)
+ }
+
+ 14%,54% {
+ -webkit-transform: translate(0,-1.5px) rotate(1.5deg);
+ transform: translate(0,-1.5px) rotate(1.5deg)
+ }
+
+ 16% {
+ -webkit-transform: translate(0,-.5px) rotate(-1.5deg);
+ transform: translate(0,-.5px) rotate(-1.5deg)
+ }
+
+ 18%,22% {
+ -webkit-transform: translate(0,.5px) rotate(-1.5deg);
+ transform: translate(0,.5px) rotate(-1.5deg)
+ }
+
+ 20%,36%,46% {
+ -webkit-transform: translate(0,-1.5px) rotate(2.5deg);
+ transform: translate(0,-1.5px) rotate(2.5deg)
+ }
+
+ 26%,50% {
+ -webkit-transform: translate(0,.5px) rotate(.5deg);
+ transform: translate(0,.5px) rotate(.5deg)
+ }
+
+ 28% {
+ -webkit-transform: translate(0,.5px) rotate(1.5deg);
+ transform: translate(0,.5px) rotate(1.5deg)
+ }
+
+ 30%,40%,62%,76%,88% {
+ -webkit-transform: translate(0,-.5px) rotate(2.5deg);
+ transform: translate(0,-.5px) rotate(2.5deg)
+ }
+
+ 32%,34%,66% {
+ -webkit-transform: translate(0,1.5px) rotate(-.5deg);
+ transform: translate(0,1.5px) rotate(-.5deg)
+ }
+
+ 42% {
+ -webkit-transform: translate(0,2.5px) rotate(-1.5deg);
+ transform: translate(0,2.5px) rotate(-1.5deg)
+ }
+
+ 44%,70% {
+ -webkit-transform: translate(0,1.5px) rotate(.5deg);
+ transform: translate(0,1.5px) rotate(.5deg)
+ }
+
+ 48%,74%,82% {
+ -webkit-transform: translate(0,-.5px) rotate(.5deg);
+ transform: translate(0,-.5px) rotate(.5deg)
+ }
+
+ 52%,56%,60% {
+ -webkit-transform: translate(0,2.5px) rotate(2.5deg);
+ transform: translate(0,2.5px) rotate(2.5deg)
+ }
+
+ 58% {
+ -webkit-transform: translate(0,.5px) rotate(2.5deg);
+ transform: translate(0,.5px) rotate(2.5deg)
+ }
+
+ 84% {
+ -webkit-transform: translate(0,1.5px) rotate(2.5deg);
+ transform: translate(0,1.5px) rotate(2.5deg)
+ }
+
+ 90% {
+ -webkit-transform: translate(0,2.5px) rotate(-.5deg);
+ transform: translate(0,2.5px) rotate(-.5deg)
+ }
+
+ 92% {
+ -webkit-transform: translate(0,.5px) rotate(-.5deg);
+ transform: translate(0,.5px) rotate(-.5deg)
+ }
+
+ 94% {
+ -webkit-transform: translate(0,2.5px) rotate(.5deg);
+ transform: translate(0,2.5px) rotate(.5deg)
+ }
+
+ 0%,100% {
+ -webkit-transform: translate(0,0) rotate(0);
+ transform: translate(0,0) rotate(0)
+ }
}
\ No newline at end of file |