Samouczek dotyczący znaczników podkreślających HTML z przykładami
HTML udostępnia różne opcje stylizacji tekstu. Jednym z nich jest podkreślanie tekstu HTML. Samo podkreślenie spowoduje narysowanie prostej linii pod tekstem bez zajmowania linii poniżej. W tym samouczku nauczymy się, jak podkreślać tekst HTML za pomocą znacznika < u >, kodu CSS, klasy CSS i ustaw właściwości podkreślania i alternatywy.
Podkreśl tekst za pomocą < u > Tag
HTML udostępnia tag < u > w celu podkreślenia podanego tekstu w HTML. < u > to tag początkowy dla podkreślenia, a < / u służy do ustawiania końca podkreślenia. Znaczniki podkreślenia można bez problemu stosować do różnych typów tekstu, takich jak hiperłącza, pogrubiony tekst itp. W poniższym przykładzie podkreślimy pojedyncze słowo lub całe zdanie lub hiperłącze. Znacznik < u > lub podkreślony znacznik HTML jest obsługiwany przez wszystkie główne przeglądarki, takie jak Google Chrome, Mozilla Firefox, Microsoft Edge, Safari czy Opera .
Podkreśl tekst z atrybutem CSS text-decoration
CSS udostępnia atrybut text-decoration
w celu podkreślenia różnych elementów HTML. Możemy użyć atrybutu text-decoration, aby podkreślić tekst HTML. Atrybut stylu dekoracji tekstu może być używany z różnymi znacznikami lub elementami HTML. W poniższym przykładzie użyliśmy tagu < span > do zaznaczenia tekstu i podkreślenia go.
Ustaw kolor i styl podkreślenia tekstu
W niektórych przypadkach samo podkreślenie tekstu HTML może nie wystarczyć. Możemy również pokolorować lub zmienić styl podkreślenia. Atrybut CSS text-decoration
może być używany do stylizowania i kolorowania podkreśleń za pomocą < u > tag lub bez niego. Poniżej zapewnimy kolor podkreślenia tekstu HTML jako czerwony, zielony oraz styl jako faliste, przerywane, kropkowane i podwójne.
wavy
utworzy nieprostą linię, gdzie linia będzie falista jak fale.
dashed
styl utworzy przerywane podkreślenie.
dotted
styl jest podobny do przerywanego, ale punkty będą mniejsze.
Styl double
umieści dwa podkreślenia, gdzie domyślnym jest pojedyncze podkreślenie.
Czerwony kolor i przerywane podkreślenie może służyć do wyrażania błędów ortograficznych, składniowych lub ogólnych. Ponadto dotted
Użyj klasy CSS do podkreślenia tekstu HTML
Ciągłe pisanie każdego podkreślonego kodu CSS nie jest dobrą pracą. Klasę CSS można utworzyć dla różnych przypadków użycia podkreślenia i tej klasy można użyć do podkreślenia tekstu HTML z innymi znacznikami HTML. W poniższym przykładzie utworzymy różne klasy CSS, takie jak underline-red, underline-green, aby łatwo utworzyć podkreślenie tekstu.