U HTML-u možemo promijeniti veličinu bilo koje slike koristeći sljedeće različite načine:
- Korištenje HTML oznake
- Korištenje atributa stila Inline
- Korištenje internog CSS-a
Korištenje HTML oznake
Napomena: HTML 5 ne podržava atribut visine i širine , tako da moramo koristiti atribut ugrađenog stila i interne CSS opcije za promjenu slike ili veličine slike.
Ako želimo promijeniti veličinu slike u dokumentu pomoću Html oznaka koji se želi prikazati na web stranici, moramo slijediti korake koji su navedeni u nastavku. Pomoću ovih koraka možemo jednostavno promijeniti veličinu slike:
Korak 1: Prvo moramo upisati Html kod u bilo kojem uređivaču teksta ili otvoriti postojeću Html datoteku u uređivaču teksta u kojem želimo promijeniti veličinu slike.
Chnage the Size of an image Hello User! <br> You are at <br> <img src="//techcodeview.com/img/html-tutorial/88/how-change-image-size-html.webp"> <br>
Korak 2: Sada postavite kursor unutar img oznake. Zatim, moramo koristiti atribut visine i širine img oznake za promjenu veličine slike. Dakle, moramo upisati ove atribute:
<img src="//techcodeview.com/img/html-tutorial/88/how-change-image-size-html.webp">
Korak 3: I, na kraju, moramo spremiti Html datoteku i zatim je pokrenuti.
strukture koje koriste nizove u c
Chnage the Size of an image Hello User! <br> You are at <br> <img src="//techcodeview.com/img/html-tutorial/88/how-change-image-size-html.webp"> <br>Testirajte sada
Izlaz gornjeg Html koda prikazan je na sljedećoj snimci zaslona:
Korištenje atributa Inline Style
Ako želimo promijeniti veličinu slike pomoću ugrađenog atributa stila koji će biti prikazan na web stranici, moramo slijediti korake koji su navedeni u nastavku. Pomoću ovih koraka možemo jednostavno promijeniti veličinu slike.
Korak 1: Prvo moramo utipkati Html kod u bilo kojem uređivaču teksta ili otvoriti postojeću Html datoteku u uređivaču teksta u kojem želimo koristiti atribut style za promjenu veličine slike.
Change the Size of an image using inline style attribute Hello User! <br> You are at <br> <img src="//techcodeview.com/img/html-tutorial/88/how-change-image-size-html.webp"> <br>
Korak 2: Sada postavite kursor unutar img oznaka te slike čiju veličinu želimo promijeniti. Zatim, moramo upisati atribut style odmah nakon atributa src. Zatim, moramo upisati svojstvo širine i visine u atribut stila kao što je prikazano u sljedećem bloku:
<img src="//techcodeview.com/img/html-tutorial/88/how-change-image-size-html.webp"> <br>
Korak 3: I na kraju moramo spremiti Html datoteku i zatim je pokrenuti.
Change the Size of an image using inline style attribute Hello User! <br> You are at <br> <img src="//techcodeview.com/img/html-tutorial/88/how-change-image-size-html.webp"> <br>Testirajte sada
Izlaz gornjeg Html koda prikazan je na sljedećoj snimci zaslona:
Korištenje internog CSS-a
Ako želimo promijeniti veličinu slike ili slike pomoću interne kaskadne tablice stilova koja će biti prikazana na web stranici, moramo slijediti korake koji su navedeni u nastavku. Pomoću ovih koraka možemo jednostavno promijeniti veličinu bilo koje slike.
Korak 1: Prvo moramo utipkati Html kod u bilo kojem uređivaču teksta ili otvoriti postojeću Html datoteku u uređivaču teksta u kojem želimo koristiti interni CSS za promjenu veličine slike.
javascript funkcija poziva iz html-a
Change the Size of an image using internal CSS Hello User! <br> This is <img src="//techcodeview.com/img/html-tutorial/88/how-change-image-size-html.webp"> <br>
Korak 2: Sada moramo postaviti kursor u oznaku head Html dokumenta i zatim definirati stilove unutar oznaku kao što je prikazano u sljedećem bloku. A zatim upišite širina i visina atribut u id birač.
#imagesize { width:100px; height:100px; }
Korak 3: Sada moramo upisati id u img tag te slike čiju veličinu želimo promijeniti:
Change the Size of an image using internal CSS #imagesize { width:200px; height:200px; } Hello User! <br> This is <br> <img src="//techcodeview.com/img/html-tutorial/88/how-change-image-size-html.webp" id="imagesize"> <br>Testirajte sada
Korak 5: Sada moramo spremiti Html datoteku i zatim pokrenuti datoteku. Sljedeća snimka zaslona prikazuje izlaz gornjeg Html koda: