Main Page/styles.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
Line 4: | Line 4: | ||
} | } | ||
.text-container { | .text-container { | ||
text-align: center; | |||
width: 100%; | |||
position: relative; | |||
height: 50px; | height: 50px; | ||
overflow: hidden; | overflow: hidden; | ||
margin: 0 auto; | |||
} | } | ||
.text { | .text { | ||
display: inline-block; | |||
width: | width: 200px; | ||
height: 100%; | height: 100%; | ||
font-size: 24px; | font-size: 24px; | ||
animation: slide 6s infinite; | animation: slide 6s infinite; |
Revision as of 23:42, 24 October 2024
.mainpage-title{ font-size:1.6em; font-weight: bold; } .text-container { text-align: center; width: 100%; position: relative; height: 50px; overflow: hidden; margin: 0 auto; } .text { display: inline-block; width: 200px; height: 100%; font-size: 24px; animation: slide 6s infinite; } .text:nth-child(2) { animation-delay: 2s; } .text:nth-child(3) { animation-delay: 4s; } @keyframes slide { 0%, 33.33% { opacity: 1; transform: translateY(0); } 16.67%, 50% { opacity: 0; transform: translateY(-100%); } 33.33%, 66.67% { transform: translateX(0); } 29.17%, 37.5%, 62.5%, 70.83% { transform: translateX(-5px); } 33.33%, 66.67% { transform: translateX(5px); } }