Etichetă HTML img este folosit pentru a afișa imaginea pe pagina web. Eticheta HTML img este o etichetă goală care conține numai atribute, etichetele de închidere nu sunt utilizate în elementul de imagine HTML.
Să vedem un exemplu de imagine HTML.
<h2>HTML Image Example</h2> <img src="//techcodeview.com/img/html-tutorial/39/html-image.webp" alt="Good Morning Friends">Testează-l acum
Ieșire:
Atributele etichetei HTML img
Src și alt sunt atribute importante ale etichetei HTML img. Toate atributele etichetei de imagine HTML sunt prezentate mai jos.
1) src
Este un atribut necesar care descrie sursa sau calea imaginii. Acesta indică browserului unde să caute imaginea pe server.
Locația imaginii poate fi pe același director sau pe alt server.
2) totul
Atributul alt definește un text alternativ pentru imagine, dacă acesta nu poate fi afișat. Valoarea atributului alt descrie imaginea în cuvinte. Atributul alt este considerat bun pentru potențialul SEO.
3) lățimea
Este un atribut opțional care este utilizat pentru a specifica lățimea pentru afișarea imaginii. Nu este recomandat acum. Ar trebui să aplicați CSS în locul atributului width.
4) înălțime
Este h3 înălțimea imaginii. Atributul HTML înălțime acceptă și elemente iframe, imagine și obiect. Nu este recomandat acum. Ar trebui să aplicați CSS în locul atributului înălțime.
actor berbec
Utilizarea atributului înălțime și lățime cu eticheta img
Ați învățat cum să inserați o imagine în pagina dvs. web, acum dacă vrem să oferim o înălțime și lățime pentru a afișa imaginea conform cerințelor noastre, atunci o putem seta cu atributele de înălțime și lățime ale imaginii.
Exemplu:
<img src="//techcodeview.com/img/html-tutorial/39/html-image-2.webp" alt="animal image">Testează-l acum
Ieșire:
Notă: Încercați întotdeauna să introduceți imaginea cu înălțime și lățime, altfel poate pâlpâi în timp ce este afișată pe pagina web.
Utilizarea atributului alt
Putem folosi atributul alt cu etichetă. Va afișa un text alternativ în cazul în care imaginea nu poate fi afișată în browser. Următorul este exemplul pentru atributul alt:
<img src="//techcodeview.com/img/html-tutorial/39/html-image-2.webp" alt="animal image">
Ieșire:
Cum se obține o imagine dintr-un alt director/dosar?
Pentru a insera o imagine pe web, acea imagine trebuie să fie prezentă în același folder în care ați pus fișierul HTML. Dar dacă, într-un caz, imaginea este disponibilă în alt director, atunci puteți accesa imaginea astfel:
În declarația de mai sus am pus imaginea pe discul local E------> folderul imagini------>img/html-tutorial/39/html-image-2.webp.
Notă: Dacă adresa URL src va fi incorectă sau greșită, atunci nu va afișa imaginea pe pagina web, așa că încercați să introduceți adresa URL corectă.
Utilizare etichetați ca link
De asemenea, putem lega o imagine cu altă pagină sau putem folosi o imagine ca link. Pentru a face acest lucru, pune eticheta în interiorul etichetă.
Exemplu:
<img src="//techcodeview.com/img/html-tutorial/39/html-image-2.webp">Testează-l acum
Ieșire:
Suport pentru browsere
Element | Crom | IE | Firefox | Operă | Safari |
da | da | da | da | da |