logo

Kā mainīt attēla izmēru HTML

HTML mēs varam mainīt jebkura attēla izmēru, izmantojot šādus dažādus veidus:

  1. Izmantojot HTML tagu
  2. Iekļautā stila atribūta izmantošana
  3. Izmantojot iekšējo CSS

Izmantojot HTML tagu

Piezīme: HTML 5 neatbalsta augstuma un platuma atribūtu , tāpēc attēla vai attēla izmēra maiņai ir jāizmanto iekļautais stila atribūts un iekšējās CSS opcijas.

Ja vēlamies mainīt attēla izmēru dokumentā, izmantojot Html tags kas ir jāparāda tīmekļa lapā, mums ir jāveic tālāk norādītās darbības. Izmantojot šīs darbības, mēs varam viegli mainīt attēla izmēru:

1. darbība: Pirmkārt, mums ir jāievada HTML kods jebkurā teksta redaktorā vai jāatver esošais HTML fails teksta redaktorā, kurā vēlamies mainīt attēla izmēru.

 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. darbība: Tagad novietojiet kursoru img taga iekšpusē. Un tad mums ir jāizmanto img taga atribūts augstums un platums, lai mainītu attēla izmēru. Tātad, mums ir jāievada šie atribūti:

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

3. darbība: Un beidzot mums ir jāsaglabā HTML fails un pēc tam tas jāpalaiž.

saraksta atkārtošana java
 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> 
Izmēģiniet to tūlīt

Iepriekš minētā HTML koda izvade ir parādīta šajā ekrānuzņēmumā:

Kā mainīt attēla izmēru HTML

Iekļautā stila atribūta izmantošana

Ja mēs vēlamies mainīt attēla izmēru, izmantojot iekļauto stila atribūtu, kas jāparāda tīmekļa lapā, mums ir jāveic tālāk norādītās darbības. Izmantojot šīs darbības, mēs varam viegli mainīt attēla izmēru.

1. darbība: Pirmkārt, mums ir jāievada HTML kods jebkurā teksta redaktorā vai jāatver esošais HTML fails teksta redaktorā, kurā vēlamies izmantot stila atribūtu attēla izmēra maiņai.

 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. darbība: Tagad novietojiet kursoru iekšpusē img tags attēlam, kura izmēru vēlamies mainīt. Un pēc tam mums ir jāievada stila atribūts tieši aiz atribūta src . Un tad mums ir jāievada platuma un augstuma rekvizīts stila atribūtā tāpat kā parādīts šajā blokā:

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

3. darbība: Un beidzot mums ir jāsaglabā HTML fails un pēc tam tas jāpalaiž.

 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> 
Izmēģiniet to tūlīt

Iepriekš minētā HTML koda izvade ir parādīta šajā ekrānuzņēmumā:

Kā mainīt attēla izmēru HTML

Izmantojot iekšējo CSS

Ja mēs vēlamies mainīt attēla vai attēla izmēru, izmantojot iekšēju kaskādes stila lapu, kas jāparāda tīmekļa lapā, mums ir jāveic tālāk norādītās darbības. Izmantojot šīs darbības, mēs varam viegli mainīt jebkura attēla izmēru.

1. darbība: Pirmkārt, mums ir jāievada HTML kods jebkurā teksta redaktorā vai jāatver esošais HTML fails teksta redaktorā, kurā mēs vēlamies izmantot iekšējo CSS, lai mainītu attēla izmēru.

mācīties selēnu
 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. darbība: Tagad mums ir jānovieto kursors HTML dokumenta tagā head un pēc tam jādefinē stili tagu, kā parādīts nākamajā blokā. Un pēc tam ierakstiet platums un augstums atribūtu id atlasītājā.

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

3. darbība: Tagad mums ir jāievada ID tā attēla img tagā, kura lielumu mēs vēlamies mainīt:

 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> 
Izmēģiniet to tūlīt

5. darbība: Tagad mums ir jāsaglabā HTML fails un pēc tam jāpalaiž fails. Šis ekrānuzņēmums parāda iepriekš minētā HTML koda izvadi:

Kā mainīt attēla izmēru HTML