width
L'attribut width définit la longueur horizontale d'un élément dans le système des coordonnées de l'utilisatrice ou l'utilisateur.
Cet attribut peut être utilisé avec les éléments SVG suivants :
<feBlend><feColorMatrix><feComponentTransfer><feComposite><feConvolveMatrix><feDiffuseLighting><feDisplacementMap><feDropShadow><feFlood><feGaussianBlur><feImage><feMerge><feMorphology><feOffset><feSpecularLighting><feTile><feTurbulence><filter><foreignObject><image><mask><pattern><rect><svg><use>
Exemple
<svg viewBox="0 0 100 300" xmlns="http://www.w3.org/2000/svg">
<!-- Avec une largeur de 0 ou inférieure, rien ne sera affichée -->
<rect x="0" y="0" width="0" height="90" />
<rect x="0" y="100" width="60" height="90" />
<rect x="0" y="200" width="100%" height="90" />
</svg>
<feBlend>
Pour <feBlend>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feColorMatrix>
Pour <feColorMatrix>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feComponentTransfer>
Pour <feComponentTransfer>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feComposite>
Pour <feComposite>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feConvolveMatrix>
Pour <feConvolveMatrix>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feDiffuseLighting>
Pour <feDiffuseLighting>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feDisplacementMap>
Pour <feDisplacementMap>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feDropShadow>
Pour <feDropShadow>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feFlood>
Pour <feFlood>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feGaussianBlur>
Pour <feGaussianBlur>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feImage>
Pour <feImage>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feMerge>
Pour <feMerge>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feMorphology>
Pour <feMorphology>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feOffset>
Pour <feOffset>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feSpecularLighting>
Pour <feSpecularLighting>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feTile>
Pour <feTile>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<feTurbulence>
Pour <feTurbulence>, width définit la longueur horizontale de la zone de rendu de la primitive.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 100% |
| Peut être animé | Oui |
<filter>
Pour <filter>, width définit la longueur horizontale de la zone de rendu du filtre.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 120% |
| Peut être animé | Oui |
<foreignObject>
Pour <foreignObject>, width définit la longueur horizontale de la zone de rendu pour le document référencé.
| Valeur |
auto|<length>|<percentage>
|
|---|---|
| Valeur par défaut | auto (traité comme 0) |
| Peut être animé | Oui |
Note :
À partir de SVG2, width est une propriété géométrique, ce qui signifie que cet attribut peut aussi être utilisé comme une propriété CSS pour <foreignObject>.
<image>
Pour <image>, width définit la longueur horizontale de l'image.
| Valeur |
auto | <length>|<percentage>
|
|---|---|
| Valeur par défaut | auto (traité comme la hauteur intrinsèque de l'image) |
| Peut être animé | Oui |
Note :
À partir de SVG2, width est une propriété géométrique, ce qui signifie que cet attribut peut également être utilisé comme propriété CSS pour les images.
<mask>
Pour <mask>, width définit la longueur horizontale de sa zone d'effet. L'effet exact de cet attribut est influencé par l'attribut maskUnits.
| Valeur |
<length>|<percentage>
|
|---|---|
| Valeur par défaut | 120% |
| Peut être animé | Oui |
<pattern>
Pour <pattern>, width définit la longueur horizontale du motif répété. L'effet exact de cet attribut est influencé par les attributs patternUnits et patternTransform.
| Valeur |
<length>
|
|---|---|
| Valeur par défaut | 0 |
| Peut être animé | Oui |
<rect>
Pour <rect>, width définit la longueur horizontale du rectangle.
| Valeur |
auto|<length>|<percentage>
|
|---|---|
| Valeur par défaut | auto (traité comme 0) |
| Peut être animé | Oui |
Note :
À partir de SVG2, width est une propriété géométrique, ce qui signifie que cet attribut peut aussi être utilisé comme une propriété CSS pour les rectangles.
<svg>
Pour <svg>, width définit la longueur horizontale de la zone de rendu de la zone d'affichage SVG.
Note :
Dans un document HTML, si les deux attributs viewBox et width sont absents, l'élément SVG sera rendu avec une hauteur de 150px.
| Valeur |
auto|<length>|<percentage>
|
|---|---|
| Valeur par défaut | auto (traité comme 100%) |
| Peut être animé | Oui |
Note :
À partir de SVG2, width est une propriété géométrique et peut donc être utilisée comme propriété CSS pour <svg>.
<use>
Pour <use>, width définit la longueur horizontale de l'élément référencé.
| Valeur |
auto|<length>|<percentage>
|
|---|---|
| Valeur par défaut | auto (traité comme 0) |
| Peut être animé | Oui |
Note : width n'a pas d'effet sur les éléments <use>, à moins que l'élément référencé ait un attribut viewbox, c'est-à-dire que leur effet s'applique uniquement si use fait référence à un élément <svg> ou <symbol>.
Note :
À partir de SVG2, width est une propriété géométrique, ce qui signifie que cet attribut peut également être utilisé comme propriété CSS sur les éléments utilisés.