Les 3 plaatjes toevoegen.

fig 3.1
<!DOCTYPE html>
<html lang="nl">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Voorbeeldpagina</title>
</head>

<body>
<h1>Welkom op mijn website</h1>
<p>Dit is een  eenvoudige HTML-structuur.</p>
<img src="pictures/nl.jpg alt="NL Vlag"> 
</body>
</html>

Hierboven (fig 3.1) zie je hoe je een afbeelding op je website plaatst. Er zijn twee belangrijke onderdelen:

-src — dit is de locatie van je afbeelding.
-alt — deze tekst helpt zoekmachines (SEO) jouw website beter te vinden. als je <img> tag gebruikt is dit het resultaat zoals in fig 3.2.

fig 3.2


Er zijn nog 2 belangrijke ondelen voor de img tag dat is height end width hiermee kan je de grote meestal in pixels of % aangeven. voorbeeld is te zien in fig 3.3

fig 3.3
<img src="pictures/nl.jpg alt="NL Vlag" width="50px" height="50px">

Vragen

1. Met welke tag verschijnt er een plaatje op de website.
2. Moet je de img tag afsluiten.
3. Met eigenschap pas je de breedte van het plaatje aan.
4. Zoek uit wat er precies veranderd als je het plaatje procentueel veranderd.
5. Upload dit en kijk of het werkt.

Ga naar de volgende les