<line>

Baseline Widely available

Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.

L'élémentSVG<line> est une forme de base SVG utilisée pour tracer une ligne reliant deux points.

Contexte d'utilisation

Catégories	Élément de forme basique, Élément graphique, Élément de forme
Contenu autorisé	Tout élément de cette liste, quel qu'en soit l'ordre : Éléments d'animation Éléments descriptifs

Attributs

x1: Définit la coordonnée x du point de départ de la ligne.Type de valeur :<length> |<percentage> |<number> ;Valeur par défaut :0 ;Animation :oui
x2: Définit la coordonnée x du point d'arrivée de la ligne.Type de valeur :<length> |<percentage> |<number> ;Valeur par défaut :0 ;Animation :oui
y1: Définit la coordonnée y du point de départ de la ligne.Type de valeur :<length> |<percentage> |<number> ;Valeur par défaut :0 ;Animation :oui
y2: Définit la coordonnée y du point d'arrivée de la ligne.Type de valeur :<length> |<percentage> |<number> ;Valeur par défaut :0 ;Animation :oui
pathLength: Définit la longueur totale du tracé en unités utilisateur.Type de valeur :<number> ;Valeur par défaut :aucune ;Animation :oui

Interface DOM

Cet élément implémente l'interfaceSVGLineElement.

Exemple

html,body,svg {  height: 100%;}

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" />  <!-- Si on n'indique pas stroke, la ligne de couleur       ne sera pas visible --></svg>