V HTML-ju lahko spreminjamo velikost katere koli slike na naslednje različne načine:

1. Uporaba oznake HTML
2. Uporaba atributa sloga Inline
3. Uporaba internega CSS

Uporaba oznake HTML

Opomba: HTML 5 ne podpira atributa višine in širine , zato moramo uporabiti atribut vgrajenega sloga in notranje možnosti CSS za spreminjanje slike ali velikosti slike.

Če želimo spremeniti velikost slike v dokumentu z uporabo Html oznaka ki naj bo prikazan na spletni strani, moramo slediti korakom, ki so navedeni spodaj. S temi koraki lahko preprosto spremenimo velikost slike:

Korak 1: Najprej moramo v kateri koli urejevalnik besedil vtipkati kodo Html ali v urejevalniku besedil odpreti obstoječo datoteko Html, v kateri želimo spremeniti velikost 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> 

2. korak: Zdaj postavite kazalec znotraj oznake img. In potem moramo uporabiti atribut višine in širine oznake img za spreminjanje velikosti slike. Torej moramo vnesti te atribute:

 <img src="//techcodeview.com/img/html-tutorial/88/how-change-image-size-html.webp"> 

3. korak: In končno moramo shraniti datoteko Html in jo nato zagnati.

izjava o primeru verilog

 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> 

Rezultat zgornje kode Html je prikazan na naslednjem posnetku zaslona:

Uporaba atributa Inline Style

Če želimo spremeniti velikost slike z atributom sloga v vrstici, ki naj bo prikazana na spletni strani, moramo slediti korakom, ki so navedeni spodaj. S temi koraki lahko preprosto spremenimo velikost slike.

Korak 1: Najprej moramo v kateri koli urejevalnik besedil vtipkati kodo Html ali v urejevalniku besedil odpreti obstoječo datoteko Html, v kateri želimo uporabiti atribut style za spreminjanje velikosti 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> 

2. korak: Zdaj postavite kazalec znotraj oznaka img tiste slike, katere velikost želimo spremeniti. In potem moramo atribut style vnesti takoj za atributom src. Nato moramo vnesti lastnost širine in višine v atribut sloga, kot je prikazano v naslednjem bloku:

 <img src="//techcodeview.com/img/html-tutorial/88/how-change-image-size-html.webp"> <br> 

3. korak: In končno moramo shraniti datoteko Html in jo nato zagnati.

 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> 

Rezultat zgornje kode Html je prikazan na naslednjem posnetku zaslona:

Uporaba internega CSS

Če želimo spremeniti velikost slike ali slike z uporabo notranje kaskadne tabele slogov, ki naj bo prikazana na spletni strani, moramo slediti korakom, ki so navedeni spodaj. S temi koraki lahko preprosto spremenimo velikost katere koli slike.

Korak 1: Najprej moramo v kateri koli urejevalnik besedil vtipkati kodo Html ali v urejevalniku besedil odpreti obstoječo datoteko Html, v kateri želimo uporabiti notranji CSS za spreminjanje velikosti slike.

java datum zdaj

 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> 

2. korak: Zdaj moramo postaviti kazalec v oznako head dokumenta Html in nato definirati sloge znotraj oznako, kot je prikazano v naslednjem bloku. In nato vnesite širina in višina atribut v izbirnik ID-ja.

 #imagesize { width:100px; height:100px; } 

3. korak: Zdaj moramo vnesti ID v oznako img te slike, katere velikost želimo spremeniti:

 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> 

5. korak: Zdaj moramo shraniti datoteko Html in jo nato zagnati. Naslednji posnetek zaslona prikazuje rezultat zgornje kode Html: