vollständig
gekürzt
<!DOCTYPE html> <html lang="de"> <head> <meta charset="utf-8"> <title>HCL134 Transformieren</title> <style> .mitUL {position:relative; display:inline-block;} .mitUL:before { content: ""; position: absolute; width: 100%; border-bottom: 3px solid black; bottom: 0; left: 0; animation: meineAniStart 2s; } @keyframes meineAniStart { from {transform: scaleX(0);} to {transform: scaleX(1);} } #drehe { animation: meineDrehung infinite 60s linear; display: inline-block; margin: 20%; } @keyframes meineDrehung { from {transform: rotate(-90deg);} to {transform: rotate(270deg);} } </style> </head> <body> <h1 class="mitUL">Unsere Abteilung als Profit-Center</h1> <div id="drehe">Sekunden ⇒</div> </body> </html>
