Element Uitleg Demonstratie
Les 1 - Inleiding HTML
<html> Hiermee kun je een HTML document aanmaken n.v.t.
<head> Hier plaats je alle informatie over de pagina n.v.t.
<body> Hier plaats je de feitelijke content van de pagina n.v.t.
<title> Wordt gebruikt om je pagina een titel te geven (voor het tabblad) (zie tabblad)
<p> Hiermee kun je een paragraaf aanmaken

Dit is een paragraaf.

<br> Om een nieuwe regel te beginnen Nieuwe regel
beginnen.
<strong> Hiermee kun je tekst als belangrijk markeren tekst met strong
<em> Hiermee kun je tekst als benadrukt markeren tekst met em
Les 2 - Teksten
<meta> Hier plaats je metagegevens plaatsen (vooral voor SEO) n.v.t.
<h1> t/m <h6> Met deze elementen kun je headings (kopjes) maken

Dit is een h3-heading

<del> Streept tekst door Tekst met del
<ins> Onderstreept tekst Tekst met ins
<sup> Plaatst tekst in super script, boven Tekst met sup
<sub> Plaatst tekst in sub script, onder Tekst met sub
<q> Plaatst quotes om tekst Tekst met q
<blockquote> Plaats tekst ingesprongen en kan met bron aangegeven worden wie het heeft gezegd of waar het vandaan komt
Een blockquote
<abbr> Geeft een afgekort word een title waar de betekenis staat Tekst met een:abbr
Les 3 - Lijsten
<ul> unsorted list, lijst zonder nummering
  • voorbeeld
  • voorbeeld
<li> lijst item zie boven en onder
<ol> ordered list, lijst met nummering
  1. voorbeeld
  2. voorbeeld 2
<dl> description list
voorbeeld
beschrijving
voorbeeld 2
beschrijving 2
<dt> term/naam zie boven
<dd> beschrijving zie boven
Les 4 - hyperlinks
<a> standaard link link
Les 5 - afbeeldingen
<img> plaats een afbeelding L logo from deathnote
<map> maakt een selectie map voor afbeeldingen
<area> de specifieke selectie gebeiden voor <map>
<object> voor svg afbeeldingen
<svg> om een svg te maken in browser voorbeeld onder
<rect> vierkant in svg
<circle> cirkel in svg
<ellipse> ellipse in svg
<line> lijn in svg
<polygon> polygon in svg
<polyline> lijn met meerdere punten
Les 6 - tabellen
<table> basis voor tabel voor alle tabel tags zie deze website
<tr> tabel rij
<th> tabel titel
<td> tabel data
<caption> een titel of beschrijving van de info in de tabel
<thead> hoofd van de tabel
<tbody> midden van tabel
Les 7 - metagegevens
<meta> meta tag voor meta informatie veel verschillende opties
<link> relatie tussen bestand en externe bron
<script> linkt javascript aan html document
Les 8 - formulieren
<form> basis voor formulier zie onder
<label> geeft naam aan input methode zie onder
<input> input voor veel opties
<datalist> voor een dropdown menu
<fieldset> plaats een verdeling in een formulier
<legend> geeft de fieldset een naam
<optgroup> voor select, om een lijst te verdelen in stukken
<select> dropdown menu selectie
Les 9 - media
<audio> om audio aftespelen of plaatsen op de site
<video> om video aftespelen of te plaatsen
<iframe> een frame op de site die van bron verandert kan worden
<canvas> een canvas waar via javascript op gewerkt kan worden
Les 10 - divisies
<header> hoofd van de site
<section> een onafhankelijke sectie van de site
<article> delen die met elkaar een relatie hebben, kan binnen sectie of andersom
<footer> de voet van de site
<aside> extra info die niet nodig is voor de sections of content