Tekstafsnit med HTML

Der er, til at styre tekstafsnit i HTML, en lang række tags, hver med sin fordel. Den eneste måde at få det til at give mening, er at vise dem.


P-tag'en
P-tag'en (paragraph) er tekstafsnit som vi kender den fra bøger, aviser osv. hvor teksten er delt op i afsnit. Tekstafsnit med denne tag har et indbygget linjeskift både før og efter, og en indbygget afstand, svarende til en margin-bottom på ca. 5 px. Et afsnit med P-tag'en vil derfor altid starte på ny linje, og det efterfølgende vil også altid starte på en ny linje. Hvis man f.eks. ser på koden for to afsnit med to linjer hver, så ser den således ud:


På siden kommer det til at se således ud:



Man kan fjerne linjeskiftet ved STYLE="display: inline-block", men man skal lige være opmærksom på, at denne løsning også fjerner linjeskift lavet med <BR> og laver det om til et tabulator-indryk i stedet.


DIV-tag'en
DIV er langt den mest udbredte tag til tekstafsnit. Den ligner til forveksling P-tag'en, dvs. et afsnit med et indbygget linjeskift, men uden at øge afstanden til det næste afsnit. Et afsnit med DIV-tag'en vil derfor altid starte på ny linje, og det efterfølgende vil også altid starte på en ny linje.


På siden kommer det til at se således ud:


Bemærk den manglende afstand mellem afsnittene som P-tag'en havde. Har man brug for den, kan den laves med margin-bottom på DIV'ens STYLE.

Man kan fjerne linjeskiftet ved STYLE="display: inline-block", men man skal lige være opmærksom på, at denne løsning også fjerner linjeskift lavet med <BR> og laver det om til et tabulator-indryk i stedet.


SPAN-tag'en
SPAN er et tekstafsnit ligesom P og DIV, men bruges til tekstsekvenser i et afsnit, f.eks. understregning eller kursiv.


På siden kommer det til at se således ud:


Bemærk at 2. linje i afsnit 1 fortsætter direkte med 1. linje i afsnit 2, uden mellemrum eller linjeskift som ved P- og DIV-tag'ene.

Man skal være opmærksom på, at der i SPAN er nogle begrænsninger. Styles lavet med style sheets kan til tider gøre, at den style man har lagt på sin SPAN bliver ignoreret. I så fald, må man prøve at omgå problemet, f.eks. med en DIV, som ikke synes at have dem samme begrænsning.


BLOCKQUOTE-tag'en
BLOCKQUOTE er en meget anvendelig tag til afsnit der skal rykkes ind. Principielt kan den ikke noget, som man ikke kan gøre med DIV, hvorfor man ofte ser denne brugt i stedet, men til sider der bruger mange DIV'er gør brugen af BLOCKQUOTE det lettere at finde rundt i koden.

Tag'en har ligesom P-tag'en et tvunget linjeskift og noget afstand til til teksten, både før og efter, og adskiller sig reelt kun fra P-tag'en ved at have en større højremargin. Som kode ser det således ud:


På siden kommer det til at se således ud:




PRE-tag'en
PRE er en tag, der viser teksten med fonten Courier, hvor alle bogstaver har samme bredde. Linjeskift i koden bliver bibeholdt i visningen, i modsætning til de andre tags der kun viser linjeskift ved BR-tags. Ved mellemrum efter hinanden i koden bliver disse vist som flere mellemrum, i stedet for at blive reduceret til ét mellemrum, som er den normale måde browsere fortolker koden. Som ofte er det en tag der anvendes, når man skal demonstrere kodesekvenser til f.eks. HTML.

Tag'en har ligesom P-tag'en et tvunget linjeskift og noget afstand til til teksten, både før og efter. Som kode ser det således ud:


På siden kommer det til at se således ud:




CODE-tag'en
CODE gør det samme som SPAN, blot med den forskel at teksten vises med fonten Courier, hvor alle bogstaver har samme bredde. Tag'en er lavet til at vise kode, men i forhold til visning på sider gør den nøjagtigt det samme som de to tags SAMP og KBD. Som kode ser det således ud:


På siden kommer det til at se således ud:




SAMP-tag'en
SAMP gør det samme som en SPAN, blot med den forskel at teksten vises med fonten Courier, hvor alle bogstaver har samme bredde. Tag'en er lavet til at vise uddrag af output fra et program, men i forhold til visning på sider gør den nøjagtigt det samme som de to tags CODE og KBD. Som kode ser det således ud:


På siden kommer det til at se således ud:




KBD-tag'en
KBD gør det samme som en SPAN, blot med den forskel at teksten vises med fonten Courier, hvor alle bogstaver har samme bredde. Tag'en er lavet til at vise input på keyboard, men i forhold til visning på sider gør den nøjagtigt det samme som de to tags SAMP og CODE. Som kode ser det således ud:


På siden kommer det til at se således ud: