HTML img žyma naudojamas vaizdui rodyti tinklalapyje. HTML img žyma yra tuščia žyma, kurioje yra tik atributai, uždarymo žymos nenaudojamos HTML vaizdo elemente.

Pažiūrėkime HTML vaizdo pavyzdį.

 <h2>HTML Image Example</h2> <img src="//techcodeview.com/img/html-tutorial/39/html-image.webp" alt="Good Morning Friends"> 

Išvestis:

HTML img žymos atributai

Src ir alt yra svarbūs HTML img žymos atributai. Visi HTML vaizdo žymos atributai pateikti žemiau.

1) src

Tai būtinas atributas, apibūdinantis vaizdo šaltinį arba kelią. Jis nurodo naršyklei, kur ieškoti vaizdo serveryje.

Vaizdo vieta gali būti tame pačiame kataloge arba kitame serveryje.

2) viskas

Atributas alt apibrėžia alternatyvų vaizdo tekstą, jei jo negalima rodyti. Alt atributo reikšmė apibūdina vaizdą žodžiais. Alt atributas laikomas tinkamu potencialiems SEO.

3) plotis

Tai pasirenkamas atributas, naudojamas norint nurodyti vaizdo rodymo plotį. Dabar tai nerekomenduojama. Vietoj pločio atributo turėtumėte taikyti CSS.

4) aukštis

Tai h3 vaizdo aukštis. HTML aukščio atributas taip pat palaiko iframe, vaizdo ir objekto elementus. Dabar tai nerekomenduojama. Vietoj aukščio atributo turėtumėte taikyti CSS.

Aukštis ir plotis atributo naudojimas su img žyma

Sužinojote, kaip įterpti vaizdą į savo tinklalapį, dabar, jei norime suteikti tam tikrą aukštį ir plotį, kad vaizdas būtų rodomas pagal mūsų reikalavimą, galime jį nustatyti su vaizdo aukščio ir pločio atributais.

Pavyzdys:

 <img src="//techcodeview.com/img/html-tutorial/39/html-image-2.webp" alt="animal image"> 

Išvestis:

Pastaba: visada stenkitės įterpti vaizdą su aukščiu ir pločiu, kitaip jis gali mirgėti rodomas tinklalapyje.

Alt atributo naudojimas

Mes galime naudoti alt atributą su žyma. Jame bus rodomas alternatyvus tekstas tuo atveju, jei vaizdas negali būti rodomas naršyklėje. Toliau pateikiamas alt atributo pavyzdys:

 <img src="//techcodeview.com/img/html-tutorial/39/html-image-2.webp" alt="animal image"> 

Išvestis:

Kaip gauti vaizdą iš kito katalogo/aplanko?

Norėdami įterpti vaizdą į žiniatinklį, tas vaizdas turi būti tame pačiame aplanke, kuriame įdėjote HTML failą. Bet jei tam tikru atveju vaizdas yra kitame kataloge, galite pasiekti vaizdą taip:

Aukščiau pateiktame teiginyje įdėjome vaizdą į vietinį diską E ------> vaizdų aplankas ------> img/html-tutorial/39/html-image-2.webp.

Pastaba: jei src URL bus neteisingas arba neteisingai parašytas, jis nerodys jūsų vaizdo tinklalapyje, todėl pabandykite įvesti teisingą URL.

Naudokite pažymėti kaip nuorodą

Taip pat galime susieti paveikslėlį su kitu puslapiu arba naudoti paveikslėlį kaip nuorodą. Norėdami tai padaryti, įdėkite žyma viduje žyma.

Pavyzdys:

 <img src="//techcodeview.com/img/html-tutorial/39/html-image-2.webp"> 

Išvestis:

Palaikomos naršyklės

Elementas	Chrome	T.Y	Firefox	Opera	Safari
	Taip	Taip	Taip	Taip	Taip