1/31
Looks like no tags are added yet.
Name | Mastery | Learn | Test | Matching | Spaced |
---|
No study sessions yet.
<!DOCTYPE html>
Duidt aan dat dit een HTML5-document is. Nodig om browser in correcte modus te zetten.
<html lang="en">
Begin van je HTML-pagina, helpt zoekmachines en screenreaders.
<head>
Bevat metadata, scripts en stylesheets die niet direct zichtbaar zijn
<meta charset="UTF-8">
Zorgt ervoor dat speciale tekens zoals accenten correct weergegeven worden.
<meta name="viewport"...>
Zorgt voor responsive gedrag op mobiele apparaten
<title>
Bepaalt de titel van de browser-tab. In jouw geval: “LGBTQ”
<link>
Verbindt je pagina met externe stylesheets (bootstrap
, index.css
).
<script>
Laadt externe scripts zoals Font Awesome en Bootstrap JavaScript
<nav>
HTML5-element voor navigatie. Geeft semantische betekenis aan de navbar.
<div>
Container die elementen groepeert en structuur geeft (veelvuldig gebruikt).
<a>
Maakt een hyperlink naar een anker op de pagina. Ook gebruikt voor het logo
<button>
Knop-element. Hier gebruikt om het mobiele menu open te klappen.
<span>
Navigatiebar
Inline container. Hier gebruikt om het hamburger-icoon te tonen.
<img>
Navigatiebar
Toont het logo bovenaan.
<ul>
, <li>
Navigatiebar
Maakt een lijst van navigatie-items
<h1>
Header
Grootste kop op de pagina. Gebruikt voor de titel "LGBTQIA"
<div>
Header
Omvat de achtergrondafbeelding + titeltekst.
<div>
Pins
Gebruikt voor layout (Bootstrap card-group
, card
, card-body
).
<img>
Pins
Toont afbeeldingen van de pins.
<h4>
, <h5>
Pins
Subtitels van elk product.
<p>
Pins
Beschrijving van elk product + prijs.
<h3>
, <h6>
Hulpnummers
Titel en subtitel van de hulpdiensten.
<p>
Hulpnummers
Beschrijvende tekst van de hulpdienst.
<b>
Getuigenissen
Benadrukt de naam van de spreker (vetgedrukt).
<p>
Getuigenissen
Bevat het citaat van de getuigenis.
<button>
Getuigenissen
Een knop om "Meer getuigenissen" te tonen. (Enkel visueel)
<img>
Petra
Toont afbeelding van Petra De Sutter.
<h1>
, <p>
Petra
Titel en citaat van Petra
<button>
Petra
Knop om "Lees meer" aan te geven. (Visueel, nog geen actie).
<h3>
Footer
Titels in de footer zoals "Over mij", "Contact info".
id="..."
Wordt gebruikt om naar bepaalde secties te scrollen via href="#..."
.
class="..."
Bepaalt welke CSS of Bootstrap-klassen van toepassing zijn.