<line>

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

Das <line> SVG-Element ist eine grundlegende SVG-Form, die verwendet wird, um eine Linie zwischen zwei Punkten zu zeichnen.

Beispiel

html
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
  <line x1="0" y1="80" x2="100" y2="20" stroke="black" />

  <!-- If you do not specify the stroke
       color the line will not be visible -->
</svg>

Attribute

x1

Definiert die x-Achsen-Koordinate des Startpunkts der Linie. Wertetyp: <length>|<percentage>|<number> ; Standardwert: 0; Animierbar: ja

x2

Definiert die x-Achsen-Koordinate des Endpunkts der Linie. Wertetyp: <length>|<percentage>|<number> ; Standardwert: 0; Animierbar: ja

y1

Definiert die y-Achsen-Koordinate des Startpunkts der Linie. Wertetyp: <length>|<percentage>|<number> ; Standardwert: 0; Animierbar: ja

y2

Definiert die y-Achsen-Koordinate des Endpunkts der Linie. Wertetyp: <length>|<percentage>|<number> ; Standardwert: 0; Animierbar: ja

pathLength

Definiert die gesamte Pfadlänge in Benutzereinheiten. Wertetyp: <number> ; Standardwert: none; Animierbar: ja

Nutzungskontext

KategorienGrundformelement, Grafikelement, Formelement
Erlaubter InhaltBeliebige Anzahl folgender Elemente, in beliebiger Reihenfolge:
Animationselemente
Beschreibende Elemente

Spezifikationen

Specification
Scalable Vector Graphics (SVG) 2
# LineElement

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch