Cadre intégré

Dans la section précédente, on a étudié les cadres, c'est-à-dire comment diviser la page principale en plusieurs parties, chacune de ces parties étant un document HTML à part entière. On va maintenant s'intéresser aux cadres intégrés, c'est-à-dire comment insérer un autre document HTML dans une zone délimitée d'un document « classique ».

L'élément IFRAME

Pour utiliser les cadres intégrés, on utilise l'élément IFRAME dont la balise fermante est optionnelle. Les cadres intégrés sont donc inséré dans des documents « classiques », comme le montre l'exemple du listing suivant.

Voici par exemple le moteur de recherche Google.be inséré ci-dessous. Vous pouvez faire une recherche, surfer, ... tout en gardant le document original ouvert.

Propriétés

Voyons les différentes propriétés qu'on va pouvoir spécifier. La première la même que pour les cadres de la section précédente et représente le document à charger dans le cadre. Il s'agit de l'attribut src.

Ensuite, il faut savoir qu'un cadre intégré n'est pas redimensionnable par l'utilisateur et qu'il faut dès lors préciser ses dimensions à l'aide des attributs width et height pour la largeur et la hauteur du cadre. On peut, comme d'habitude, préciser ces dimensions en pixels ou en pourcentage de l'espace libre.

Enfin, on peut aussi spécifier un nom au cadre avec l'attribut name. Ceci permettra d'ouvrir des liens dans le cadre intégré en utilisant l'attribut target de l'élément A, comme on a vu à la fin de la section précédente.

Finalement, vous devez savoir que cet élément est déprécié. En effet, pour insérer un document HTML dans un autre, il est recommandé d'utiliser l'élément OBJECT dont on parlera au chapitre 7.