summaryrefslogtreecommitdiffstats
path: root/assets/css/main
diff options
context:
space:
mode:
Diffstat (limited to 'assets/css/main')
-rw-r--r--assets/css/main/special.css249
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