Beispiel:SVG-CSS-animation-1.html

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

<html lang="de"> <head> 

 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <style>
  1. loading {

animation-name: widen-brighten; animation-duration: 4s; animation-direction: alternate; animation-timing-function: ease-in-out; animation-iteration-count: infinite; transform-origin: 10px; width: 280px; }

@keyframes widen-brighten { from { fill: darkgreen; transform: scaleX(0) } to { fill: lime; transform: scaleX(1) } } 

 </style>
 <title>SVG mit CSS animieren - 1</title>

</head> <body> <svg viewBox="0 0 300 100" > 

 <rect id="loading" x="10" y="10" width="20" height="20" />

</svg>

</body> </html>

Abgerufen am 23.01.2026
von "http://wiki.selfhtml.org/wiki/Beispiel:SVG-CSS-animation-1.html"