Template:Teachingspyrocss

/*LOOK AT THIS SPYRO*/ /*Everywhere that I put 'EEE' you are going to want to edit*/ /*I will put 'EEE' and then what you need to put there with no spaces. Replace all of it with what you want.*/ /*Where it says '4s infinite' you should put any small number or just leave it at 4 (2-4)*/ /***********How and what to edit**************/ /* First, come up with a name for your font. Put this name everywhere that I put 'fontname'. Don't forget the one next to @keyframes. Next, pick your colors! You can google '#000000' to find any hex code. Put the hexcodes you want where I put 'hexcode'. If you put, say, red for hexcode1, put red for every spot that says hexcode1. The hexcode next to 'color:' at the bottom is what will show up for people using non-webkit browsers (they can't see a gradient font.) You will put what color you want their browser to resort to if it can't see the gradients. */ /*LOOK AT THIS SPYRO*/ /* EEEfontname Text (Webkit only!) */ .text-EEEfontname { background-image: -webkit-gradient(linear, left top, right top, color-stop(0, EEEhexcode1), color-stop(0.25, EEEhexcode2), color-stop(0.5, EEEhexcode3), color-stop(0.75, EEEhexcode4), color-stop(1, EEEhexcode5)); background-image: -webkit-linear-gradient(left, EEEhexcode1 0%, EEEhexcode2 25%, EEEhexcode3 50%, EEEhexcode4 75%, EEEhexcode5 100%); background-size: 1000% 1000%; -webkit-background-clip: text; -webkit-text-fill-color: transparent; -webkit-animation: Text-EEEfontname 4s infinite; color: EEEhexcode; /* Fallback color for non-webkit browsers */ white-space: nowrap; }

@keyframes Text-EEEfontname {0% {background-position: 0% 50%} 50% {background-position: 100% 50%} 100% {background-position: 0% 50%} }