Les propriétés de liseré SVG
SVG offre une large gamme de propriétés d'AVC. Dans ce chapitre, nous allons examiner ce qui suit:
- accident vasculaire cérébral
- stroke-width
- stroke-linecap
- AVC-dasharray
Toutes les propriétés d'un AVC peuvent être appliquées à tout type de lignes, le texte et les contours des éléments comme un cercle.
SVG AVC Propriété
La propriété de la course définit la couleur d'une ligne, le texte ou le contour d'un élément:
Voici le code SVG:
Exemple
<svg height="80" width="300">
<g fill="none">
<path stroke="red" d="M5 20 l215 0" />
<path stroke="black" d="M5 40 l215 0" />
<path stroke="blue" d="M5 60 l215 0" />
</g>
</svg>
Essayez - le vous - même » stroke-width SVG Propriété
La propriété stroke-width définit l'épaisseur d'une ligne, le texte ou le contour d'un élément:
Voici le code SVG:
Exemple
<svg height="80" width="300">
<g fill="none" stroke="black">
<path stroke-width="2" d="M5 20 l215 0" />
<path stroke-width="4" d="M5 40 l215 0" />
<path stroke-width="6" d="M5 60 l215 0" />
</g>
</svg>
Essayez - le vous - même » SVG stroke-linecap Propriété
La propriété stroke-linecap définit les différents types de terminaisons à un chemin ouvert:
Voici le code SVG:
Exemple
<svg height="80" width="300">
<g fill="none" stroke="black" stroke-width="6">
<path stroke-linecap="butt" d="M5 20 l215 0" />
<path stroke-linecap="round" d="M5 40 l215 0" />
<path stroke-linecap="square" d="M5 60 l215 0" />
</g>
</svg>
Essayez - le vous - même » SVG stroke-dasharray Propriété
La propriété de la course-dasharray est utilisé pour créer des lignes en pointillés:
Voici le code SVG:
Exemple
<svg height="80" width="300">
<g fill="none" stroke="black" stroke-width="4">
<path stroke-dasharray="5,5" d="M5 20 l215 0" />
<path stroke-dasharray="10,10" d="M5 40 l215 0" />
<path stroke-dasharray="20,10,5,5,5,10" d="M5 60 l215 0" />
</g>
</svg>
Essayez - le vous - même »