html knowhow

Text mit Neuigkeithinweis

So sieht´s aus

Quellcode

<html lang="de">
<head>

<style type="text/css">
@keyframes blinkcolor {
30%{color: #df4a48;}
70%{color: #284454;}
100%{color: #389c15;} }
@keyframes moveleft {
0%{transform: translate(0px);}
50%{transform: translate(20px);}
100%{transform: translate(0px);} }
@keyframes moveright {
0%{transform: translate(0px);}
50%{transform: translate(-20px);}
100%{transform: translate(0px);} }
.theme-details .we-install {font-size: 3em;}
.we-install {text-align: center; font-size: 3em; }
.we-install a {color: #df4a48; border-bottom: 1px solid; padding: 5px; text-decoration: none; position: relative; animation-name: blinkcolor;
animation-duration: 3s; animation-iteration-count: infinite; animation-fill-mode: both;}
.we-install a:hover {animation-play-state: paused;}
.we-install a:before {content: "\1F816"; font-family: fontawesome; position: absolute; left: -15%; animation-name: moveleft; animation-duration: 1s;
animation-iteration-count: infinite; animation-fill-mode: both;}
.we-install a:after {content: "\1F814"; font-family: fontawesome; position: absolute; right: -15%; animation-name: moveright; animation-duration: 1s;
animation-iteration-count: infinite; animation-fill-mode: both;}
</style>
</head>

<body >
<div class="we-install"> <a href="#">Hallo. Hier ist HTML Knowhow</a></div>
</body>

</html>

Kontakt Datenschutz Impressum