Herzlich willkommen zum SELF-Treffen 2026
vom 24.04. – 26.04.2026
in Halle (Saale)
Beispiel:SVG-CSS-animation-2.html
Aus SELFHTML-Wiki
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Kreis zeichnen mit SVG + CSS</title>
<style>
svg { height: 15em; }
circle {
stroke: steelblue;
fill: none;
stroke-width: 5;
stroke-dasharray: 1.5;
stroke-dashoffset: 1.5;
animation: drawCircle 3s linear infinite;
}
@keyframes drawCircle {
to { stroke-dashoffset: 0; }
}
</style>
</head>
<body>
<svg viewBox="0 0 120 120">
<circle pathLength="1" cx="60" cy="60" r="50" />
</svg>
</body>
</html>
