logo

Comment aligner l'image en HTML

Si nous souhaitons déplacer l'image vers les différents emplacements de la page Web à l'aide de la balise HTML, nous devons suivre les étapes indiquées ci-dessous.

Étape 1: Tout d'abord, nous devons taper le code Html dans n'importe quel éditeur de texte ou ouvrir le fichier Html existant dans l'éditeur de texte dans lequel nous voulons aligner une image :

 Align an Image Hello User! This page helps us to understandhow to specify an image at a particular position in a pargraph using the Html tag. <img src="//techcodeview.com/img/html-tutorial/33/how-align-image-html.webp"> 

Étape 2: Maintenant, placez le curseur à l'intérieur du balise de cette image que nous voulons aligner. Et puis, nous devons utiliser l'attribut align de la balise img pour spécifier l'emplacement. Nous devons donc taper l’attribut align comme décrit dans le bloc suivant.

 <img src="//techcodeview.com/img/html-tutorial/33/how-align-image-html.webp" alt> 

Étape 3: Après avoir spécifié l'emplacement, nous devons enregistrer le code HTML puis exécuter le fichier. Il existe différents codes HTML suivants qui affichent l'image dans le paragraphe à différents endroits :

1. Milieu

Cette valeur d'alignement place l'image au milieu.

 Align an Image at middle Hello User! <p>This page helps us to understand how to align an image in Html. <img src="//techcodeview.com/img/html-tutorial/33/how-align-image-html.webp" alt> It is first section in this page which describes how to specify an image at middle in a pargraph using the Html tag.</p> 
Testez-le maintenant

La sortie du code HTML ci-dessus est affichée dans la capture d'écran suivante :

Comment aligner l'image en HTML

2. Haut

Cette valeur d'alignement définit l'image en haut.

 Align an Image at Top Hello User! <p>This page helps us to understand how to align an image in Html. <img src="//techcodeview.com/img/html-tutorial/33/how-align-image-html.webp" alt> It is Second section in this page which describes how to specify an image at top in a paragraph using the Html tag.</p> 
Testez-le maintenant

La sortie du code HTML ci-dessus est affichée dans la capture d'écran suivante :

Comment aligner l'image en HTML

3. En bas

Cette valeur d'alignement définit l'image en bas.

 Align an Image at bottom Hello User! <p>This page helps us to understand how to align an image in Html. <img src="//techcodeview.com/img/html-tutorial/33/how-align-image-html.webp" alt> It is third section in this page which describes how to specify an image at bottom in a paragraph using the Html tag.</p> 
Testez-le maintenant

La sortie du code HTML ci-dessus est affichée dans la capture d'écran suivante :

Comment aligner l'image en HTML

Encore 4

Cette valeur d'alignement définit l'image à gauche.

 Align an Image at left Hello User! <p>This page helps us to understand how to align an image in Html. <img src="//techcodeview.com/img/html-tutorial/33/how-align-image-html.webp" alt> It is fourth section in this page which describes how to specify an image at left side of a paragraph using the Html tag.</p> 
Testez-le maintenant

La sortie du code HTML ci-dessus est affichée dans la capture d'écran suivante :

Comment aligner l'image en HTML

5. C'est vrai

Cette valeur d'alignement définit l'image à droite.

 Align an Image at Right Hello User! <p>This page helps us to understand how to align an image in Html. <img src="//techcodeview.com/img/html-tutorial/33/how-align-image-html.webp" alt> It is fifth section in this page which describes how to specify an image at right side of a paragraph using the Html tag.</p> 
Testez-le maintenant

La sortie du code HTML ci-dessus est affichée dans la capture d'écran suivante :

Comment aligner l'image en HTML