Blog technologiczny od 2014 · 1 112 wpisów
RSS

HTML: jak przekreślić tekst?

Dzisiaj szybka piłka dla wszystkich, którzy zastanawiają się jak w HTML uzyskać efekt przekreślonego tekstu. Jak to często bywa w HTML i CSS ten efekt można osiągnąć na kilka sposobów.

Jeszcze kilka lat temu, w czasach gdy popularny był HTML w wersji 4 (tak, HTML ma różne wersje) efekt przekreślonego tekstu można było uzyskać za pomocą tagu <strike>. Z racji tego, że wspomniana wersja HTML jest już przestarzała (ang. deprecated), to nie powinno się jej używać.

Przekreślenie tekst HTML za pomocą tagu

W nowszej wersji HTML, która jest już poprawnie rozumiana przez najnowsze przeglądarki efekt przekreślonego tekstu można osiągnąć na dwa sposoby. Pomiędzy nimi jest subtelna różnica, semantyczna. Wszystko zależeć będzie w jakim kontekście będziemy przekreślać tekst.

Tag <s>

Tagu HTML  <s> używa się aby przedstawić rzeczy (treści), które nie są już istotne lub nie są już dokładne.

Warto wspomnieć, że tag <s> nie jest odpowiedni do oznaczania zmian w dokumencie. W tym celu używa się tagu <del>. Tagu del można użyć np. w części aplikacji która pokazuje zmiany pomiędzy jedną wersją dokumentu (np. tekstu) a drugą. Taką funkcję posiada m.in. git (github, bitbucket) czy nawet WordPress.

Przekreślenie tekstu za pomocą tagu HTML <s>: To jest przekreślony tekst.

Przekreślenie tekstu za pomocą CSS

Podobny efekt można użyć za pomocą odpowiedniego stylu w CSS:

zsh
text-decoration: line-through;
Opublikowano · Znalazłeś błąd? Napisz
Piotr Cichosz
Autor

Od ponad 10 lat jestem zaangażowany w świat elektroniki użytkowej, zdobywając szeroką wiedzę i doświadczenie w testowaniu oraz recenzowaniu najnowszych technologii. Moja kariera obejmuje pracę w wiodących firmach technologicznych, gdzie specjalizowałem się…

Czytaj dalej
← Poprzedni „Afera” z kursem złotówki w Google pokazała, że nie umiemy myśleć