Skrift med gennemstregning med HTML

På samme måde som man kan lave en understregning, kan man lave en gennemstregning, hvor der kommer en linje gennem teksten.

Gennemstregningen kan kun laves på én måde: STYLE="text-decoration: line-through". Style skal være lagt på en tag til tekstafsnit som f.eks. <P>, <DIV> og <SPAN>. Som man normalt bruger tekstdekorationer i en tekst vil <SPAN> sædvanligvis være en god løsning, fordi den ikke tilfører tekststrengen andre formateringer.

Et stykke tekst med gennemstregning vil som kode se således ud:



På siden, når den vises, ser det således ud:




I tidligere versioner af HTML har man haft en tag der hedder STRIKE. Officielt understøttes denne tag ikke af HTML 5, men i skrivende stund (januar 2020) fungerer denne tag også under HTML 5:


Fordi det er en tag der er under afvikling, anbefales det herfra, at man anvender text-decoration: line-through i stedet for STRIKE, både af hensyn til valideringen af koden og fordi man ikke kan forvente, at tag'en bliver ved med at fungere som den skal på alle platforme.

I stedet for direkte at specificere en gennemstregning, kan man bruge de to tags S og DEL, som repræsenterer hhv. "tekst som ikke længere er korrekt" og "slettet tekst". Det man blot skal være opmærksom på, er at det kun er de fleste browsere der for disse to tags har gennemstregning som default. Vil man være helt sikker på, at de to tags altid giver gennemstregning, skal man specificere det i stylesheet, således:


Det betyder også, at hvis man sætter text-decoration: none eller text-decoration: underline, vil de to tags vise hhv. ingen streger eller understregning i stedet.

Fordi det er tags med specifikke funktioner i opmærkningen af teksten, anbefales det herfra, at man kun bruger S og DEL, hvor det er korrekt opmærkning af teksten som noget der ikke længere er sandt, eller noget der er slettet. Har man brug for gennemstregning af andre årsager, er anbefalingen herfra, at man anvender text-decoration: line-through direkte på tag'en, hvis det er hele tag'ens indhold der skal være gennemstreget, og ellers, at man bruger text-decoration: line-through sammen med en SPAN.

Denne type styling er, ved kombination med andre effekter, yderst følsom over for både programmering og browser. Så her er det af største vigtighed at få testet både forskellige browsertyper og forskellige versioner af de enkelte typer.

Linjens tykkelse påvirkes for nogle browserer af at teksten bliver med fede typer, så her skal man være lidt opmærksom på sine kombinationer. Når man arbejder med en tekst-streng der alligevel er stylet af en tag som f.eks. <SPAN>, så plejer jeg at anbefale at man tilføjer sin styling på dette, hvis det er praktisk muligt. Det er en praktisk ting omkring overskueligheden af koderne. Koden for kombinationen ser i så fald således ud:



På siden, når den vises, ser det således ud:




Linjens tykkelse og placering påvirkes også af størrelsen på skriften, f.eks. ved højtstillet og lavtstillet skrift, men effekten varierer afhængigt af hvilken browser man anvender. Her skal man yderligere være opmærksom på kombinationseffekter, hvor variationer i programmeringen også kan give varierende effekter.

Hvis vi prøver at se på et midlertidigt skift til 16.0 pt, hvor hver sektion er styret af sin egen kode, så ser koden således ud:



På siden, når den vises, ser det således ud:



Hvis man derimod laver en sektion med ny størrelse inden i den sektion der har overliggende linje, ser koden således ud:



På siden ser det således ud.



Ved nogle browsere vil man se én ubrudt linje, mens man ved andre browsere vil se at linjen skifter niveau ved overgangen til en anden fontstørrelse.