R
-Online
N
havo 4
informatica
vwo 4

Plaatjes:
Plaatsen en opmaken

dia 30

Het toevoegen van een plaatje is eenvoudig. Je hoeft enkel een regel op te nemen in je HTML waarin je verwijst naar het plaatje. Het maakt daarbij wel uit wat de bron is: Heb je het bestand in een map op je eigen computer staan of ergens op het internet.

Staat het plaatje op je eigen computer dan gebruik je een relatieve verwijzing. De plaats van het bestand is relatief t.o.v. het html-bestand waar het in aangeroepen wordt. Heb je al je bestanden voor de website bij elkaar in een map en een aparte map in die hoofdmap met de naam ″plaatjes″ waarin het bestand ″kikkers.jpg″ staat dan ziet je code er zo uit

In een map plaatjes waarin kikkers.jpg staat.

≺img src=″plaatjes⁄kikkers.jpg″ ⁄≻

Heb je een verwijzing naar een plaatje ergens op internet dan gebruik je een absolute verwijzing. Deze naam van het plaatje laat je het bestand vinden ook als je niet weet waar je html-bestand staat.

Je verwijst naar een bestand op internet.

≺img src=″http:⁄⁄ron-online.nl⁄plaatjes⁄kikkers.jpg″ ⁄≻

Wil je dit specifieke plaatje kunnen opmaken zonder alle andere plaatjes dezelfde opmaak te geven dan voeg je een class of id toe.

Bijv. id kikkers als naam voor dit plaatje

≺img id=″kikker  ″ src=″plaatjes⁄kikkers.jpg″ ⁄≻

In css kun je nu verschillende eigenschappen bepalen.

Bijv. hoogte en breedte van dit plaatje

#kikker {
  width: 400px;
  height: 300px;
}

Houd er rekening mee dat afbeeldingen standaard in-line zijn

dia 19