In HTML zijn er zowel gepaarde tags als enkele tags (ook wel zelfsluitende tags of lege elementen genoemd). Elk type heeft een specifiek doel en heeft zijn eigen functie.

Gepaarde Tags

Gepaarde tags bestaan uit openings- en sluitingstags. Ze kunnen om de inhoud heen worden geplaatst en items groeperen om enkele eigenschappen te wijzigen of elementen te verzamelen op basis van betekenis.

Syntax:

html

Hier is een echt voorbeeld van het gebruik van gepaarde tags:

In dit voorbeeld:

• <section>...</section>: groepeert gerelateerde inhoud samen;

• <h1>...</h1>: voegt een kop toe voor de sectie;

• <p>...</p>: bevat een alinea die uitlegt dat de meeste HTML-tags in paren komen.

Enkele Tags

Enkele tags bestaan alleen uit een openingstag en geen sluitingstag. Ze worden gebruikt wanneer de tag geen inhoud vereist of wanneer alle inhoud en gedrag worden gespecificeerd met behulp van attributen.

Syntax:

html

Hier is een echt voorbeeld van het gebruik van enkele tags:

Deze code bevat twee elementen:

• <input />: creëert een tekstinvoerveld. De placeholder=" name" toont een hint binnenin het vak;

• <img />: toont een afbeelding van fruit.

  • alt="Fruits": tekst die wordt weergegeven als de afbeelding niet laadt;

  • width en height: stellen de afmetingen van de afbeelding in;

  • src: specificeert de URL van de afbeelding.

Tag Nesting

Bij het nesten van tags is het essentieel om de hiërarchie volgorde te volgen, vergelijkbaar met het nesten van poppen. Elke geneste tag moet op de juiste manier worden ingesloten binnen zijn bovenliggende tag, terwijl nog steeds de regels van de HTML-syntaxis worden gevolgd.

Hier is een voorbeeld van geneste tags:

html

Laten we het volgende geldige voorbeeld bekijken:

Deze code toont een alinea met een link en benadrukte tekst:

• <p>...</p>: omhult de hele alinea;

• <a href="https://privacy.com">...</a>: maakt een klikbare link naar het Privacybeleid;

• <strong>...</strong>: maakt het woord "website" vet om het te benadrukken.

Samenvatting

HTML bestaat uit gepaarde en enkele tags, die elk verschillende doeleinden dienen. Gepaarde tags hebben een openings- en sluitingstag om inhoud te omsluiten, terwijl enkele tags zelfsluitend zijn. Het correct nesten van tags en het volgen van de juiste hiërarchie zijn essentieel voor een goed gevormde HTML-structuur.