Conception Web Responsive - Vidéo

Utilisation de l'attribut width

Si la propriété width est définie sur 100%, le lecteur vidéo ajustera automatiquement ses proportions en fonction de la taille de l'écran :

Notez que dans l'exemple ci-dessus, le lecteur vidéo ajuste automatiquement ses proportions en fonction de la taille de l'écran, et peut être plus grand que la taille d'origine. Dans la plupart des cas, nous pouvons utiliser l'attribut max-width à la place.

Utilisation de l'attribut max-width

Si la propriété max-width est définie sur 100%, le lecteur vidéo ajustera automatiquement ses proportions en fonction de l'écran, mais ne dépassera pas sa taille d'origine :

Ajout d'une vidéo à une page web

Nous pouvons ajouter une vidéo à une page web. Dans l'exemple suivant, la vidéo s'ajuste automatiquement à la taille de la zone div et remplit toute la zone div :