Cette fonction est expérimentale
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.
Résumé
La balise HTML <picture> est un contenant permettant de spécifier de multiples <source> pour l'élément <img> qu'il contient. Le navigateur choisira la source la plus appropriée selon la mise en page courante (les contraintes sur la boite où l'image apparaitra) et le périphérique sur lequel il sera affiché (comme un écran ordinaire ou haute définition).
Contexte d'utilisation
| Catégories de contenu | Contenu de flux, contenu phrasé, contenu intégré |
| Contenu autorisé | Zéro ou plus éléments <source>, puis un seul élément <img>, potentiellement mêlés à des éléments pouvant porter l'attribut <script>. |
| Omission de balises | Aucune, tant le tag d'ouverture que de fermeture est obligatoire |
| Élément parents autorisés | Tout élément acceptant du contenu intégré. |
Attributs
Cet élément n'intègre que les attributs globaux.
Spécification
| Specification | Status | Commentaire |
|---|---|---|
| WHATWG HTML Living Standard La définition de '<picture>' dans cette spécification. |
Living Standard | Définition |
Compatibilité avec les navigateurs
| Fonctionnalité | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Support basique | 38 | 33 (33) selon la préférence dom.image.picture.enabled (désactivée par défault) |
? | ? | ? |
| Fonctionnalité | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Support basique | ? | 33 (33) selon la préférence dom.image.picture.enabled (désactivée par défault) |
? | ? | ? |