Dans l'article suivant, nous allons voir comment insérer une image au sein d'une page web, en faisant en sorte que le bloc qui la contient s'adapte à sa largeur. En outre, notre image est accompagnée de sa légende et celle-ci ne devra jamais dépasser la largeur de l'image. Certains d'entre vous pensent peut-être déjà à fixer la largeur du bloc, tout simplement, et de n'utiliser que des images d'une certaine largeur... Mais nous allons voir ici qu'il est possible de créer quelque chose de beaucoup plus souple, de façon très simple.
1. La solution : un rendu de type tableau
En effet, une cellule de tableau a la capacité de s'adapter à son contenu. Autrement dit, si l'on fixe la largeur d'une cellule et que le contenu ne peut s'adapter à cette largeur (en allant à la ligne), la cellule va s'adapter au contenu le plus long (image, bloc de largeur fixe, etc.). C'est cette propriété que nous allons mettre en œuvre ici. Nous allons insérer notre image dans un conteneur de largeur fixée et celui-ci va s'adapter à la largeur de l'image si nous sommes amenés à utiliser une image plus grande. Pour cela, nous allons utiliser la...
- Accédez à tous les contenus de Connect en illimité
- Découvrez des listes de lecture et des contenus Premium
- Consultez les nouveaux articles en avant-première