Hvis vi ønsker at flytte billedet til de forskellige steder på websiden ved hjælp af HTML-tagget, skal vi følge trinene, som er angivet nedenfor.

Trin 1: For det første skal vi skrive HTML-koden i en hvilken som helst teksteditor eller åbne den eksisterende HTML-fil i teksteditoren, hvor vi vil justere et billede:

 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"> 

Trin 2: Placer nu markøren inde i tag på det billede, som vi vil justere. Og så skal vi bruge align-attributten for img-tagget til at angive placeringen. Så vi skal skrive align-attributten som den samme som beskrevet i den følgende blok.

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

Trin 3: Efter at have angivet placeringen, skal vi gemme HTML-koden og derefter køre filen. Der er følgende forskellige HTML-koder, som viser billedet i afsnittet på de forskellige steder:

1. Midten

Denne justeringsværdi sætter billedet i midten.

 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> 

Outputtet af ovenstående HTML-kode er vist i følgende skærmbillede:

2. Top

Denne justeringsværdi sætter billedet øverst.

 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> 

Outputtet af ovenstående HTML-kode er vist i følgende skærmbillede:

3. Bund

Denne justeringsværdi sætter billedet i bunden.

 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> 

Outputtet af ovenstående HTML-kode er vist i følgende skærmbillede:

4. Venstre

Denne justeringsværdi indstiller billedet til venstre.

 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> 

Outputtet af ovenstående HTML-kode er vist i følgende skærmbillede:

5. Rigtigt

Denne justeringsværdi sætter billedet til højre.

 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> 

Outputtet af ovenstående HTML-kode er vist i følgende skærmbillede: