HTML fornece diferentes opções de estilo para o texto. Sublinhar o texto HTML é um deles. O simples sublinhado desenhará uma linha reta sob o texto, sem ocupar a linha abaixo. Neste tutorial, aprenderemos como sublinhar o texto HTML com < u > tag, código CSS, classe CSS e defina as propriedades e alternativas sublinhadas.

Sublinhar o texto com < u > Tag

HTML fornece a tag < u > para sublinhar o texto fornecido em HTML. < u > é a tag inicial para sublinhar e < / u > é usado para definir o final do sublinhado. As marcas de sublinhado podem ser usadas para diferentes tipos de texto, como hiperlinks, texto em negrito, etc., sem problemas. No exemplo a seguir, iremos sublinhar uma única palavra ou frase completa ou um hiperlink. A tag < u > ou underline HTML é compatível com todos os principais navegadores, como Google Chrome, Mozilla Firefox, Microsoft Edge, Safari ou Opera .

Sublinhar texto com atributo de decoração de texto CSS

CSS fornece o atributo text-decoration para sublinhar diferentes elementos HTML. Podemos usar o atributo text-decoration para sublinhar o texto HTML. O atributo de estilo de decoração de texto pode ser usado com diferentes tags ou elementos HTML. No exemplo a seguir, usamos a tag < span > para selecionar o texto e sublinhá-lo.

Definir a cor e o estilo do sublinhado do texto

Em alguns casos, apenas sublinhar o texto HTML pode não ser suficiente. Também podemos colorir ou alterar o estilo do sublinhado. O atributo CSS text-decoration pode ser usado para estilizar e colorir os sublinhados com < u > tag ou sem ela. A seguir, forneceremos a cor de sublinhado do texto HTML como vermelho, verde e o estilo como ondulado, tracejado, pontilhado e duplo.

wavy o estilo criará o não uma linha reta onde a linha será ondulada como ondas.

dashed o estilo criará um sublinhado tracejada.

dotted O estilo é semelhante ao tracejada, mas os pontos serão menores.

O estilo double colocará dois sublinhados, onde o padrão é um sublinhado.

A cor vermelha e o sublinhado tracejada pode ser usado para expressar erros ortográficos, de sintaxe ou gerais. Além disso, dotted

Usar classe CSS para sublinhado de texto HTML

Escrever cada código CSS de sublinhado, repetidamente, não é um bom trabalho. Uma classe CSS pode ser criada para diferentes casos de uso de sublinhado e essa classe pode ser usada para sublinhado de texto HTML com outras tags HTML. No exemplo a seguir, criaremos diferentes classes CSS, como underline-red, underline-green para criar o sublinhado de texto facilmente.