La méthode la plus récente, pour aligner des images HTML, consiste à utiliser le module CSS des boîtes flexibles, dites flexbox.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Comment correctement aligner des images en HTML ?</title>
<style>
.aligner_images {
display: flex;
justify-content: space-between;
}
</style>
</head>
<body>
<div class="aligner_images">
<img src="https://via.placeholder.com/150?text=Image+01" alt="">
<img src="https://via.placeholder.com/150?text=Image+02" alt="">
<img src="https://via.placeholder.com/150?text=Image+03" alt="">
<img src="https://via.placeholder.com/150?text=Image+04" alt="">
</div>
</body>
</html>
Remarque : La propriété flex permet d'aligner les images ; et la valeur space-between permet de répartir l'espace disponible de façon égale entre chaque images.
Vous trouverez d'avantage d'information, sur la manière d'aligner des images avec la méthode des boîtes flexibles, via cette page du site de Mozilla.
