Height

« SVG Attribute reference home

Cet attribut indique une dimension verticale <length> dans le systĂšme de coordonnĂ©es. La donnĂ©e (ou coordonnĂ©e) dĂ©finie par cet attribut dĂ©pend de l'Ă©lĂ©ment sur lequel il est appliquĂ©. La plupart du temps, il reprĂ©sente la hauteur de la rĂ©gion rectangulaire composant l'Ă©lĂ©ment (voir les exceptions dans la documentation pour chaque type d'Ă©lĂ©ment).

Cet attribut doit ĂȘtre spĂ©cifiĂ©, hormis pour les Ă©lĂ©ments <svg> dont la valeur par dĂ©faut est de 100% et <mask> dont la valeur par dĂ©faut est de 120%.

Contexte d'utilisation

Catégories Aucune
Valeur <length>
Animable Oui
Documents normatif SVG 1.1 (2nd Edition): foreignObject element
SVG 1.1 (2nd Edition): image element
SVG 1.1 (2nd Edition): pattern element
SVG 1.1 (2nd Edition): rect element
SVG 1.1 (2nd Edition): svg element
SVG 1.1 (2nd Edition): use element
SVG 1.1 (2nd Edition): Filter primitive
SVG 1.1 (2nd Edition): mask element

<length>

Le type de donnĂ©es <length> correspond Ă  une mesure de distance appliquĂ©e sur un Ă©lĂ©mĂ©nt Ă  l'aide d'une unitĂ© de mesure. Ces mesures sont spĂ©cifiĂ©es de deux maniĂšres, selon leur contexte.

Lorsqu'elles sont utilisĂ©es dans une feuille de style, la mesure <length> est dĂ©finie comme suit :

length ::= number (~"em" | ~"ex" | ~"px" | ~"in" | ~"cm" | ~"mm" | ~"pt" | ~"pc")?

Lorsque les longueurs sont utilisées sur un attribut SVG, la mesure <length> est définie comme suit :

length ::= number ("em" | "ex" | "px" | "in" | "cm" | "mm" | "pt" | "pc" | "%")?

Voir les spĂ©cifications CSS2 pour en apprendre plus sur la signification de ces unitĂ©s de mesure.

Concernant les propriĂ©tĂ©s dĂ©finies en CSS2, l'utilisation d'une unitĂ© de mesures est requise. A l'inverse, les propriĂ©tĂ©s dĂ©finies par les Ă©lĂ©ments SVG et leurs attributs de prĂ©sentation associĂ©s ne nĂ©cessitent pas l'utilisation d'une unitĂ© de mesure. Si elle n'est pas explicitĂ©e, l'unitĂ© de mesure reprĂ©sentera une distance dans le systĂšme de coordonnĂ©es utilisĂ©. Si elle est spĂ©cifiĂ©e, l'unitĂ© de mesure doit toujours ĂȘtre Ă©crite en minuscule, qu'elle soit dĂ©finie en SVG1.1 ou CSS2.

Il faut noter que la dĂ©finition de la propriĂ©tĂ© <length> autorise l'utilisation du pourcentage comme unitĂ© de mesure. La valeur relative rĂ©sultant du pourcentage dĂ©pendra de l'attribut sur lequel il aura Ă©tĂ© spĂ©cifiĂ©. Deux cas :

  • Lorsque la distance exprimĂ©e en pourcentage reprĂ©sente la largeur ou la hauteur du viewport.
  • Lorsque la distance exprimĂ©e en pourcentage reprĂ©sente un pourcentage de la largeur ou hauteur d'un Ă©lĂ©ment donnĂ©.

Dans le DOM SVG, les valeurs <length> sont reprĂ©sentĂ©es par les objets SVGLength ou SVGAnimatedLength.

Exemple

<?xml version="1.0"?>
<svg width="120" height="120"
     viewBox="0 0 120 120"
     xmlns="http://www.w3.org/2000/svg">

  <rect x="10" y="10" width="100" height="100"/>
</svg>

Eléments

Les Ă©lĂ©ments suivants peuvent utiliser l'attribut height :