HTML Iframes
Un iframe HTML est utilisé pour afficher une page Web dans une page Web.
Syntaxe HTML Iframe
La balise HTML <iframe> spécifie un cadre en ligne.
Un cadre en ligne est utilisé pour intégrer un autre document dans le document HTML actuel.
Syntaxe
<iframe src="url" title="description"></iframe>
Astuce : Il est recommandé de toujours inclure un attribut title pour le <iframe>. Ceci est utilisé par les lecteurs d'écran pour lire le contenu de l'iframe.
Iframe - Définir la hauteur et la largeur
Utilisez les attributs height et width pour spécifier la taille de l'iframe.
La hauteur et la largeur sont spécifiées en pixels par défaut :
Exemple
<iframe src="demo_iframe.htm" height="200" width="300" title="Iframe Exemple"></iframe>
Try it Yourself »
Ou vous pouvez ajouter l'attribut style et utiliser les CSS height et width Propriétés :
Exemple
<iframe src="demo_iframe.htm" style="height:200px;width:300px;" title="Iframe Exemple"></iframe>
Try it Yourself »
Iframe - Supprimer la bordure
Par défaut, une iframe est entourée d’une bordure.
Pour supprimer la bordure, ajoutez l'attribut style et utilisez la propriété CSS border :
Exemple
<iframe src="demo_iframe.htm" style="border:none;" title="Iframe Exemple"></iframe>
Try it Yourself »
Avec CSS, vous pouvez également modifier la taille, le style et la couleur de la bordure de l'iframe :
Exemple
<iframe src="demo_iframe.htm" style="border:2px solid red;" title="Iframe Exemple"></iframe>
Try it Yourself »
Iframe — Cible pour un lien
Une iframe peut être utilisée comme cadre cible pour un lien.
L'attribut target du lien doit faire référence à l'attribut name de l'iframe :
Exemple
<iframe src="demo_iframe.htm" name="iframe_a" title="Iframe Exemple"></iframe>
<p><a href="https://www.w3schools.com" target="iframe_a">W3Schools.com</a></p>
Try it Yourself »
Résumé du chapitre
- La balise HTML
<iframe>spécifie un cadre en ligne - L'attribut
srcdéfinit l'URL de la page à intégrer - Toujours inclure un attribut
title(pour les lecteurs d'écran) - Les attributs
heightetwidthspécifient la taille de l'iframe - Utilisez
border:none;pour supprimer la bordure autour de l'iframe
HTML Exercices
Balise HTML iframe
| Étiquette | Description |
|---|---|
| <iframe> | Définit un frame en ligne |
Pour une liste complète de toutes les balises HTML disponibles, visitez la Référence des balises HTML sur notre site Web W3SchoolsFR. Le meilleur.
HTML — Iframe — Vidéo W3Schools
Cette vidéo explique les iframes et comment les utiliser sur votre site Web.
Fait partie d'une série de didacticiels vidéo pour apprendre le HTML pour les débutants !
