Pildi lisamine HMTL-iga

Kui loote oma veebilehe või isikliku blogi, on normaalne, et soovite seda isikupärastada nende piltidega, mis aitavad teie saiti määratleda või illustreerida seda, mida selgitate. Sel moel peate teadma, kuidas sisestada pilt HTML-iga, midagi, mis on üsna lihtne, kui järgite allpool toodud selgitust.

HTML-keel on keel, mida me kasutame oma veebilehe loomisel . Me võime siseneda meie toimetajale ja alates punktist, kus tahame pildi sisestada, peame kasutama koode või vajalikku marsruuti, et fotot saaks näha veebi või blogi sisestamisel. Selleks toimige ise, nagu me nüüd ütleme.

Pildi sisestamine HTML-iga

  1. Kõige parem on teada, kuidas HTML-iga pilti sisestada on see, et meil on näide. Selleks võtke foto, mida soovite sisestada ja salvestada oma arvutisse. Oleme võtnud ühe kutsika ja me oleme seda kutsunud "perro-divertido.jpg".
  2. Peame sisestama selle pildi HTML-i, millel on järgmine kood:
  3. See on kujutiselementi loomise kood. Järgmisena kasutatakse atribuutina tähti " src " ja need esindavad "allikat". Põhimõtteliselt, mida me teeme, on pakkuda veebibrauserile väärtust pildi allikale. Loomulikult on allika atribuudi väärtus "perro-divertido.jpg". See näide eeldab, et teie pildifail asub HTML-failiga samas kataloogis.
  4. Näiteks kui teil oli pildifail kausta "pildid" sees, muutuks kood ja see näeb välja nagu:
  5. Nagu näete, ei ole meil mõlemas koodinäites siiani lisatud sildi , sest kujutise kood on "automaatne sulgemise" element. Seda seetõttu, et erinevalt lõikest ei ole meil meie elemendis suurt sisu , vaid üks pilt. Tegelikult ei sunni HTML5 meid kunagi oma elemente "sulgema", kuid organisatsioonilistel põhjustel on alati soovitatav püüda lisada enamiku elementide traditsioonilised sulgemärgendid.
  6. Lõpuks on veel üks koodielement, mida peame lisama enne pildi HTML-i üleslaadimist. See koosneb atribuudi määramisest ja väärtuse "alt" väärtusest meie pildile. Atribuut "alt" tähendab "alternatiivi" ja seda kasutatakse alternatiivi loomiseks, mis põhineb pildi kirjeldusel tekstis vaatajatel juhul, kui pilt ei laadi või kui neil on visuaalne puue. Nii näeb meie kood lõpuks välja: