Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.Erfahre mehr über dieses Experiment.
<line>
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Das<line>SVG Element ist eine grundlegende SVG-Form, die verwendet wird, um eine Linie zu erstellen, die zwei Punkte verbindet.
Nutzungskontext
| Kategorien | Grundformelement, Grafikelement, Formelement |
|---|---|
| Erlaubter Inhalt | Beliebige Anzahl folgender Elemente, in beliebiger Reihenfolge: Animationselemente Beschreibende Elemente |
Attribute
x1Definiert die x-Achsen-Koordinate des Linienanfangspunkts.Werttyp:<length> |<percentage> |<number>;Standardwert:
0;Animierbar:jax2Definiert die x-Achsen-Koordinate des Linienendpunkts.Werttyp:<length> |<percentage> |<number>;Standardwert:
0;Animierbar:jay1Definiert die y-Achsen-Koordinate des Linienanfangspunkts.Werttyp:<length> |<percentage> |<number>;Standardwert:
0;Animierbar:jay2Definiert die y-Achsen-Koordinate des Linienendpunkts.Werttyp:<length> |<percentage> |<number>;Standardwert:
0;Animierbar:japathLengthDefiniert die gesamte Pfadlänge in Benutzereinheiten.Werttyp:<number>;Standardwert:keiner;Animierbar:ja
DOM-Schnittstelle
Dieses Element implementiert dieSVGLineElement Schnittstelle.
Beispiel
html,body,svg { height: 100%;}<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>Spezifikationen
| Specification |
|---|
| Scalable Vector Graphics (SVG) 2 # LineElement |
Browser-Kompatibilität
Siehe auch
- Andere grundlegende SVG-Formen:
<circle>,<ellipse>,<polygon>,<polyline>,<rect>