<defs>

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

SVG permet de définir des objets graphiques (génériques) pour une utilisation ultérieure. Autant qu'il est possible, cet usage est recommandé grâce aux propriétés offertes par l'élément defs. Ainsi définir ces éléments au sein de l'élément defs promeut une meilleure compréhension du contenu SVG par l'homme et donc son accessibilité.

Les éléments définis grâce à defs ne sont jamais directement générés (au sens du rendu graphique : ils ne sont pas affichés). Vous devez utiliser l'élément <use> pour leur-s utilisation-s lorsque vous le souhaitez au sein du viewport.

Contexte d'usage

CatégoriesÉlément conteneur, Élément structurel
Contenu autoriséTout élément de cette liste, quel qu'en soit l'ordre :
Éléments d'animation
Éléments descriptifs
Éléments de formes
Éléments structurels
Éléments de dégradés
<a>, <clipPath>, <cursor>, <filter>, <font>, <font-face>, <foreignObject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view>

Exemple

xml
<svg width="80px" height="30px" viewBox="0 0 80 30"
     xmlns="http://www.w3.org/2000/svg">

  <defs>
    <linearGradient id="Gradient01">
      <stop offset="20%" stop-color="#39F" />
      <stop offset="90%" stop-color="#F3F" />
    </linearGradient>
  </defs>

  <rect x="10" y="10" width="60" height="10"
        fill="url(#Gradient01)"  />
</svg>

Attributs

Attributs globaux

Attributs spécifiques

Il ne dispoe pas d'attributs spécifiques.

Interface avec DOM

Cet élément est implémenté par l'interface SVGDefsElement.

Spécifications

Specification
Scalable Vector Graphics (SVG) 2
# Head

Compatibilité des navigateurs

BCD tables only load in the browser