Jak wykonać przekreślenie fragmentu tekstu na stronie z pomocą HTML i/lub CSS?

przekreślenie tekstu z html i css

Kategoria wpisu Kurs HTML, Kursy, PHP, HTML, CSS, Tekst Tagi: , , , on przez .


1 Gwizdka2 Gwizdki3 Gwizdki4 Gwizdki5 Gwizdki (Brak ocen)
Loading...

Przekreślenie tekstu na stronie internetowej jest bardzo proste i niespecjalnie czasochłonne. W zależności od tego w jaki sposób wprowadzamy tekst na stronę do wyboru zazwyczaj mamy HTML i CSS. Watro tutaj wspomnieć, że jeśli korzystacie z edytora tekstu to prawdopodobnie będzie on dodawał znaczniki HTML.

Znaczniki te są dużo bardziej powszechne w przypadku tradycyjnych stron internetowych. Ograniczają się bowiem do pewnego obszaru i bardzo łatwo można je dodać.

Przekreślenie tekstu w HTML

W HTML posiadamy 2 typy znaczników, z pomocą których możemy przekreślić tekst na stronie internetowej. W przypadku pisanej przez nas samodzielnie strony to od nas tylko będzie zależało, na który z nich się zdecydujemy. Między uzyskanymi efektami nie będzie bowiem praktycznie żadnej różnicy.

Przekreślenie <s></s>

przykład:

Przekreślony tekst

 

Przekreślenie <del></del>

przykład:

Przekreślony tekst

 

Jak to wygląda w CSS:

Praktycznie jak do tej pory może ze dwa razy spotkałam się z przypadkiem by ktokolwiek korzystał z tej metody. W obu przypadkach przekreślenia pełniło bardziej rolę dekoracji (jak wskazuje sama nazwa). Prawdopodobnie wynika to, że metoda HTML jest dużo łatwiejsza i szybsza w użytkowaniu. Efekt końcowy jaki z jej pomocą można uzyskać jest dokładnie taki sam.

Przykład:

przekreślenie w css

To oczywiście tylko jedna z opcji zmiennej text-decorationU możliwa ona bowiem dodawanie podkreślenia w różnych miejscach. W efekcie z jej pomocą możemy ustawiać linie w różnych miejscach nie tylko przez środek tekstu, ale także np. nad i pod.