Tagging listen – Overblik! over de vigtigste HTML tags

Her på listen nedenfor finder du et overblik over de vigtigste HTML tags. Listen er lavet for at du som nybegynder i HTML skal kunne danne dig et overblik over de basale og mest nødvendige HTML tags der findes.

Synes du der mangler nogen eller har du rettelser, så skiv gerne en kommentar omkring det i kommentarfeltet nederst i indlægget. Har du tilføjelser af mere komplicerede tags, så nævn dem gerne alligevel.

Afsnit: <p>

P’et står for paragraph som på dansk er tekstafsnittet. Og det er altså et tag der laver afsnit i teksten.

Eksempel på tag:

P-tag, eksempel, HTML

Visuelt eksempel:

P-tag, eksempel, Visuel

Linieskift: <br>

Denne er som afsnit, udover at mellemrummet mellem linien du laver linieskift på, og linien ovenover ikke bliver lige så stort som hvis du laver afsnit.

Eksempel på tag:

Br-tag, eksempel, HTML

Visuelt eksempel:

Br-tag, eksempel, Visuel

 

Fed: <strong> eller  <b>

… Er det du får når du i et word-dokument markerer din tekst med ’fed’. Altså, teksten fremhæves. B’et i det sidste tag-eksempel står for bold. Når du markere en tekst med fed kan du både bruge strong eller bold, og bold altså <b>:

Eksempel på tag (strong):

strong-tag, eksempel, HTML

Eksempel på tag (bold):

b-tag, eksempel, HTML

Visuelt eksempel:

b-tag, eksempel, Visuel

 

Kursiv: <i>

Dette tag sætter altså, ganske enkelt, den tekst du laver tagget rundt om i kursiv.

Eksempel på tag:

i-tag, eksempel, HTML

Visuelt eksempel:

i-tag, eksempel, Visuel

 

Understreget: <u>

Dette tag understreger den tekst du sætter tagget om.

Eksempel på tag:

U-tag, eksempel, HTML

Visuelt eksempel:

U-tag, eksempel, Visuel

 

Maskinskrift: <tt>

Med dette tag kommer teksten du omkranser til at lige maskinskrift (meget lig den skrift der bruge i et HTML dokument).

Eksempel på tag:

tt-tag, eksempel, HTML

Visuelt eksempel:

tt-tag, eksempel, Visuel

 

Gennemstreget: <s>

Dette tag sætter en streg tværs gennem den tekst der omkranses af tagget.

Eksempel på tag:

s-tag, eksempel, HTML

Visuelt eksempel:

s-tag, eksempel, Visuel

 

Links: <a>

Dette tag fortæller den omkransede tekst at det linker til noget. En a-tag har en indbygget attribut som hedder en href-attribut. Denne attribut giver linket den URL-adresse som den skal vise hen til, når man trykker på den.

Eksempel på tag:

a-tag, eksempel, HTML

Visuelt eksempel:

At sætte de rigtige tags de rigtige steder er lige så vigtigt, som at sørge for at dine links fører hen til de rigtige sider.

Lister: <ul>, <ol> og <li>

Der er organiserede og uorganiserede lister. De organiserede lister er de, hvor elementerne markeres med tal, mens de uorganiserede markeres med prikker eller andre punkt-symboler. Organiske lister tagger man med <ol> og de uorganiske tagges med <ul>. Hvert punkt på listen skal tagges med et li-tag, dvs. <li>.

Eksempel på tag (organiseret):

ol-tag, eksempel, HTML

Visuelt eksempel:

ol-tag, eksempel, Visuel

Eksempel på tag (uorganiseret):

ul-tag, eksempel, HTML

Visuelt eksempel:

ul-tag, eksempel, Visuel

 

Tabel: <tabel>

Tabel-tagget laver – heldigt nok – tabeller, og attributterne <tr> og <td> angiver henholdsvis tabellens rækker nedad, og kolonnerne hen ad.

Eksempel på tag:

tabel-tag, eksempel, HTML

Visuelt eksempel:

tabel-tag, eksempel, Visuel

 

Billeder: <img>

Img-tagget er en smule anderledes end andre tags, fordi det ikke afsluttes på samme måde, og så er det ikke et tag der omgiver en bestemt tekst. Tagget kan ikke indeholde andre tags, da der ikke rigtigt vil være nogen mening i det.

Eksempel på tag:

img-tag, eksempel, HTML

Virtuelt eksempel:

img-tag, eksempel, Visuel

 

Når du så tilføjer et billede til din tekst, så er det jo faktisk kun brugeren der kan se indholdet af dette, men skal søgemaskinernes crawlere også får noget ud af at gennemsøge denne side, så findes der attributterne <title> eller <alt>. Disse attributter henviser til søgeord, som billedet visuelt indeholder.

Når du holder din mus hen over et billede, kan der dukke en lille tekstboks op, der hvor pilen er, hvor denne tekst, som er skrevet i disse attributter, står.

Vil du vide mere om HTML tags? Læs også ”H1, H2, H3… Headings!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Protected with IP Blacklist CloudIP Blacklist Cloud
 
x

Har du spørgsmål, ris eller ros?

Kontakt os på: 33 11 98 98
eller
service@internet.dk