HTML: Slik bygger du inn et bilde i tekst

HTML: Slik bygger du inn et bilde i tekst


Hyper Protocol Markup Language (HTML) er kjernen språket i Web. Hvert nettsted du besøker med nettleseren din har blitt opprettet eller generert ved hjelp av HTML. HTML tillater nettsteder å bruke en blanding av tekst, grafikk og media for å presentere innhold på en engasjerende, attraktiv måte. Forstå hvordan du bruker HTML er en svært viktig ferdighet for alle som ønsker å opprettholde et nettsted. En av de viktigste delene til å forstå HTML er å vite hvordan du plasserer bilder på en web-side i tekst.

Bruksanvisning

1 Bestem Web-adressen til bildet du ønsker å legge ned. Hvis bildet er allerede tilgjengelig på nettet, og deretter bestemme hvor det er ved å høyreklikke på den og velge å vise bildeegenskapene. Hvis bildet er ikke på nettet ennå, vil du ønsker å laste det opp til en offentlig tilgjengelig mappe på nettet, og deretter få sin web-adresse.

2 Åpne HTML-editor for din webside og finne sted i teksten der du vil legge inn bildet.

3 Sett inn HTML-kode i teksten der du vil at bildet skal vises som følger: "<img Her er et eksempel på et bilde med adressen" http://www.mydomain.com/images/img.jpg ": <img -taggen i HTML-bildekode. denne koden beskriver bildet ditt i en kort setning. formatet for å legge denne koden er ved å sette "alt =" etterfulgt av din beskrivelse av bildet i anførselstegn. dette er god praksis fordi de med tregere Internett-tilkoblinger vil ikke se bildet umiddelbart, og nettleseren vil sette inn denne teksten på sin plass. det er også viktig å ha i tilfelle bildet er ikke lenger tilgjengelig, eller hvis noen har slått av bilder i nettleseren. Her er "alt" tag i vårt eksempel : <img alt = "mitt bilde">.

5 Juster bildejusteringen ved å legge til "align =" innen HTML parentes. Dette er valgfritt. Hvis du ikke bruker den "align" tag, så vil bildet dukke opp i teksten der du har plassert den. De mest populære alternativene er å bruke "align = right" eller "align = left", som vil plassere bildet i teksten til høyre eller venstre, og la tekstflyten rundt det. Andre alternativer er "topp", "midten" eller "bottom". Et eksempel på dette er: <img alt = "mitt bilde" align = høyre>.

6 Juster bildestørrelsen ved å bruke "width" eller "høyde" egenskaper. Dette er valgfritt. Hvis du ikke bruker denne koden, så bildet vil vises i den eksakte størrelsen som det er. Ved hjelp av bare ett av disse egenskapene gjør at bildet ditt å skalere tilsvarende; du kan bruke både til å tvinge bildet til en eksakt størrelse. Du kan stort bilde ditt med antall piksler eller prosentandelen av den opprinnelige bildestørrelsen. Å størrelse et bilde av piksler, bare skriv inn antall piksler. Et eksempel på dette er: <img alt = "mitt bilde" align = høyre width = 100>. Å størrelse et bilde prosentvis, sette et prosenttegn på slutten. Et eksempel på dette er: <img alt = "mitt bilde" align = høyre width = 50%>.

Hint

  • Ditt bilde skal være kompatibel med alle nettlesere. Bilder i formatene PNG, GIF og JPEG fungerer vanligvis best.
  • Pass på at bildet ikke er for stor, fordi dette vil føre til at det tar lang tid å laste. Reduser størrelsen på bildet før du laste det opp til Internett.
  • Du bør være sikker på at du har rettigheter til å vise et bilde på nettstedet ditt før du bygge det. Bruk dine egne bilder eller bilder du har betalt for er alltid den beste praksis.