Pokud chceme přesunout obrázek na různá místa na webové stránce pomocí Html tagu, musíme postupovat podle níže uvedených kroků.
Krok 1: Nejprve musíme zadat Html kód v libovolném textovém editoru nebo otevřít existující Html soubor v textovém editoru, ve kterém chceme zarovnat obrázek:
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">
Krok 2: Nyní umístěte kurzor dovnitř tag obrázku, který chceme zarovnat. A pak musíme použít atribut align značky img pro určení umístění. Takže musíme zadat atribut align stejně, jak je popsáno v následujícím bloku.
<img src="//techcodeview.com/img/html-tutorial/33/how-align-image-html.webp" alt>
Krok 3: Po určení umístění musíme uložit Html kód a poté soubor spustit. Existují následující různé Html kódy, které zobrazují obrázek v odstavci na různých místech:
1. Střední
Tato hodnota zarovnání nastaví obrázek uprostřed.
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>Otestujte to hned
Výstup výše uvedeného Html kódu je zobrazen na následujícím snímku obrazovky:
2. Nahoře
Tato hodnota zarovnání nastaví obrázek nahoře.
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>Otestujte to hned
Výstup výše uvedeného Html kódu je zobrazen na následujícím snímku obrazovky:
3. Spodní
Tato hodnota zarovnání nastaví obrázek dole.
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>Otestujte to hned
Výstup výše uvedeného Html kódu je zobrazen na následujícím snímku obrazovky:
4 zbývají
Tato hodnota zarovnání nastaví obrázek vlevo.
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>Otestujte to hned
Výstup výše uvedeného Html kódu je zobrazen na následujícím snímku obrazovky:
5. Správně
Tato hodnota zarovnání nastaví obrázek vpravo.
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>Otestujte to hned
Výstup výše uvedeného Html kódu je zobrazen na následujícím snímku obrazovky:
