Forståelse af parrede og enkeltstående tags i HTML

HTML bruger to slags tags: parrede tags og enkeltstående (selvlukkende) tags. Hver type har en forskellig funktion, når en webside struktureres.

Parrede tags

Parrede tags har en åbnings- og en lukningstag. De omslutter indhold, grupperer elementer og definerer betydning eller struktur.

Syntaks:

<tag_name>Some content</tag_name>

Her er et konkret eksempel på brug af parrede tags:

I dette eksempel:

• <section>...</section>: grupperer relateret indhold;
• <h1>...</h1>: tilføjer en overskrift til sektionen;
• <p>...</p>: indeholder et afsnit, der forklarer, at de fleste HTML-tags forekommer i par.

Enkeltstående tags

Enkeltstående tags har ikke en afsluttende tag. De anvendes, når der ikke er behov for indhold mellem taggene, og al funktionalitet defineres gennem attributter.

Syntaks:

<tag_name />

Her er et konkret eksempel på brug af enkeltstående tags:

Denne kode indeholder to elementer:

• <input />: opretter et tekstindtastningsfelt. placeholder=" name" viser en hjælpetekst i feltet;
• <img />: viser et billede af frugter.
  • alt="Fruits": tekst der vises, hvis billedet ikke kan indlæses;
  • width og height: angiver billedets dimensioner;
  • src: angiver billedets URL.

Tag-indlejring

Tags skal indlejres korrekt, ligesom matryoshka-dukker, hvor hver afsluttende tag matcher sin åbningstag i den rette rækkefølge.

Her er et eksempel på indlejrede tags:

<tag1>
  <tag2>
    <tag4>...</tag4>
    <tag5>...</tag5>
  </tag2>
  <tag3>
    <tag6>...</tag6>
  </tag3>
</tag1>

Overvej følgende gyldige eksempel:

Denne kode viser et afsnit med et link og fremhævet tekst:

• <p>...</p>: omslutter hele afsnittet;
• <a href="https://privacy.com">...</a>: opretter et klikbart link til Privacy Policy;
• <strong>...</strong>: gør ordet "website" fed for at fremhæve det.