HTML img-tagg används för att visa bilden på webbsidan. HTML img-tagg är en tom tagg som endast innehåller attribut, avslutande taggar används inte i HTML-bildelement.

Låt oss se ett exempel på HTML-bild.

markdown med bilder

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

Produktion:

Attribut för HTML img-tagg

src och alt är viktiga attribut för HTML img-taggen. Alla attribut för HTML-bildtaggen anges nedan.

1) src

Det är ett nödvändigt attribut som beskriver bildens källa eller sökväg. Den instruerar webbläsaren var den ska leta efter bilden på servern.

Platsen för bilden kan vara i samma katalog eller en annan server.

2) allt

Alt-attributet definierar en alternativ text för bilden, om den inte kan visas. Värdet på alt-attributet beskriver bilden i ord. Alt-attributet anses vara bra för blivande SEO.

3) bredd

Det är ett valfritt attribut som används för att ange bredden för att visa bilden. Det rekommenderas inte nu. Du bör använda CSS i stället för width-attributet.

c# lista

4) höjd

Det h3 bildens höjd. HTML-höjdattributet stöder även iframe-, bild- och objektelement. Det rekommenderas inte nu. Du bör använda CSS i stället för attributet höjd.

sql konkat

Användning av höjd- och breddattribut med img-tagg

Du har lärt dig hur man infogar en bild på din webbsida, nu om vi vill ge lite höjd och bredd för att visa bilden enligt våra krav, så kan vi ställa in den med höjd- och breddattribut för bilden.

Exempel:

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

Produktion:

Obs: Försök alltid att infoga bilden med höjd och bredd, annars kan den flimra när den visas på webbsidan.

Användning av alt-attribut

Vi kan använda alt-attributet med märka. Det kommer att visa en alternativ text om bilden inte kan visas i webbläsaren. Följande är exemplet för alt-attribut:

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

Produktion:

javascript flerradssträng

Hur får man en bild från en annan katalog/mapp?

För att infoga en bild på din webb, måste den bilden finnas i samma mapp där du har lagt HTML-filen. Men om bilden i något fall är tillgänglig i någon annan katalog kan du komma åt bilden så här:

I ovanstående uttalande har vi lagt bilden i den lokala disken E------>images folder------>img/html-tutorial/39/html-image-2.webp.

Obs: Om src URL kommer att vara felaktig eller felstavad kommer den inte att visa din bild på webbsidan, så försök att ange korrekt URL.

Använda sig av tagga som länk

Vi kan också länka en bild till en annan sida eller så kan vi använda en bild som länk. För att göra detta, sätt tagg inuti märka.

Exempel:

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

Produktion:

Stöd för webbläsare

Element	Krom	IE	Firefox	Opera	Safari
	Ja	Ja	Ja	Ja	Ja