Sådan tilføjer du billeder til et HTML-websted

Tilføjelse af billeder til siderne på dit websted kan ofte gøre dem mere behagelige for øjet og formidle information bedre end at bruge tekst alene. Denne proces opnås ved at bruge HTML-kode og en billedfil. Filen kan være fra en anden webside eller gemt på en webserver.

Bruger tag

I HTML-koden til en webside kan du tilføje et billede ved hjælp af tag. I tag, skal du angive fire attributter:

  • Src - Kildeattributten angiver placeringen af ​​billedet. Du kan bruge en relativ sti, hvis billedet er på samme server som dit websted, men billeder fra et andet websted kræver absolutte stier.
  • Alt - Den alternative tekstattribut er en skriftlig beskrivelse af billedet.
  • Bredde - Bredden af ​​billedet.
  • Højde - Billedets højde.

En valgfri attribut er Border, som giver dig mulighed for at angive en kant omkring billedet. Rand attributten er defineret i pixel størrelse. For eksempel ved at bruge border = 1 i tag betyder grænsen omkring billedet ville være 1 pixel bredt.

Bemærk: Borderattributten er blevet udskrevet i HTML5 og understøttes ikke.

eksempler

De følgende eksempler viser den faktiske HTML, der bruges til at tilføje billedet øverst på denne side. De kan indsættes overalt i din sides krop. Den første har en kortere URL, fordi billedet er gemt på vores server; Det andet er, hvordan du vil linke til vores billede.

Eksempel 1

Eksempel to

Hvilke billedformater kan jeg bruge på en webside?

De mest almindelige billedformater, der skal bruges til billeder, fotos, logoer og andre billeder, er JPEG, GIF og PNG. Andre billedformater, der ikke understøttes bredt, som BMP, fungerer muligvis ikke i alle browsere.

Har jeg brug for citater omkring attributter i img-taggen?

Ja. Selvom dagens browsere typisk kan rette eventuelle fejl med manglende citater omkring en attributværdi, skal du altid have citater omkring en attributværdi for at forhindre fejl.