Sujet Précédent Sujet Suivant

Aligner plusieurs images en html

sneybe Messages postés 2 Statut Membre -
mpmp93 Messages postés 2931 Date d'inscription Statut Membre Dernière intervention - 1 déc. 2013 à 13:53

Bonjour,
je voudrais aligner plusieurs images et du texte en dessous de chaque images en html.
Merci de votre aide

Afficher la suite

A voir également:

Comment aligner une image et un texte en html
Extraire texte d'une image - Guide
Editeur html - Télécharger - HTML
Comment légender une image - Guide
Traitement de texte - Guide
Comment mettre un texte en majuscule - Guide

4 réponses

Réponse 1 / 4

juliendefully Messages postés 50 Statut Membre 13

Si tu fais un tableau en HTML et tu y intègre les images comme dans l'exemple en remplaçant le texte en gras :

</head>
<body>
<table style="text-align: left; width: 1064px; height: 305px;"
border="0" cellpadding="2" cellspacing="2">
<tbody>
<tr>
<td style="vertical-align: top; height: 257px; width: 343px;"><img
alt="u" src="Image1.png"><br>
</td>
<td style="vertical-align: top; height: 257px; width: 349px;"><img
alt="r" src="image2.png"><br>
</td>
<td style="vertical-align: top; height: 257px;"><img alt="u"
src="image3.png"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; height: 40px; width: 343px;">texte
image 1 </td>
<td style="vertical-align: top; height: 40px; width: 349px;">texte
image 2 </td>
<td style="vertical-align: top; height: 40px;">texte image 3 </td>
</tr>
</tbody>
</table>
</body>
</html>

planete66 Messages postés 21 Statut Membre 35

Tu peux mettre du code css afin de na pas toujours reecrire la même chose,
sinon le code est bien :)

Réponse 2 / 4

sneybe Messages postés 2 Statut Membre

Bonsoir,
Merci de votre aide, le seul souci qui reste c'est que le texte est un peu loin de l'image, pas du tout collé en dessous de l'image.
Merci

Réponse 3 / 4

juliendefully Messages postés 50 Statut Membre 13

<html>
<head>
</head>
<body>
<table style="text-align: left; width: 1064px; height: 305px;"
border="0" cellpadding="2" cellspacing="2">
<tbody>
<tr>
<td style="vertical-align: top; height: 31px; width: 343px;"><img
alt="u" src="image1.png"><br>
</td>
<td style="vertical-align: top; height: 31px; width: 349px;"><img
alt="r" src="image2.png"><br>
</td>
<td style="vertical-align: top; height: 31px;"><img alt="u"
src="image3.png"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; height: 266px; width: 343px;">texte
image 1 </td>
<td style="vertical-align: top; height: 266px; width: 349px;">texte
image 2 </td>
<td style="vertical-align: top; height: 266px;">texte image 3 </td>
</tr>
</tbody>
</table>
</body>
</html>

Réponse 4 / 4

mpmp93 Messages postés 2931 Date d'inscription Statut Membre Dernière intervention 1 341

Bonjour,

Tout est expliqué ici:
https://html5.immo-scope.com/article/html5_debuter_elementFigure

A+

Discussions similaires

image et texte sur même ligne (HTML)

Faire passer du texte SOUS une image HTML / CSS

Retrouver l'image originale d'une photo modifiée

PIX

Discussions similaires

Newsletters