Como sublinhar texto em HTML

Autor: Clyde Lopez
Data De Criação: 19 Julho 2021
Data De Atualização: 1 Julho 2024
Anonim
Curso de HTML - Aula 3 - Tags Negrito, Itálico e Sublinhado. ✅
Vídeo: Curso de HTML - Aula 3 - Tags Negrito, Itálico e Sublinhado. ✅

Contente

O método de sublinhado HTML legado é usar tags u> / u>, mas agora ele usa um método moderno baseado em CSS. O sublinhado é considerado uma maneira ruim de chamar a atenção para o texto porque é fácil confundir o texto sublinhado com um link.

Passos

Método 1 de 2: Método Moderno

  1. 1 Use a propriedade "text-decoration" em CSS. Atualmente, a marca u> não é usada para sublinhar o texto.
    • Ao adicionar essa propriedade, você não precisa alterar seu código no futuro, quando as tags antigas forem retiradas.
  2. 2 Use a tag span> para sublinhar uma parte específica do texto. Insira uma marca de início junto com a propriedade "text-decoration" na frente do texto que você deseja sublinhar. No final do texto, insira a tag / span de fechamento>.

    span style = "text-decoration: underline;"> Este texto será sublinhado. / span>

  3. 3 Especifique os elementos HTML na seção estilo> para facilitar o sublinhado. Isso também pode ser feito usando uma folha de estilo CSS. Por exemplo, para sublinhar todos os títulos de nível 3, adicione o seguinte código à seção "estilo":

    html> head> style> h3 {text-decoration: underline; } / style> / head> body> h3> Este título será sublinhado / h3> / body> / html>

  4. 4 Crie uma classe CSS para sublinhar o texto rapidamente. Você pode criar classes em sua folha de estilo ou estilo> seção para chamá-las mais tarde. A classe pode receber qualquer nome.

    html> head> style> .underline {text-decoration: underline; } / style> / head> body> Use esta classe para div> sublinhado rápido / div> vários div> elementos / div> / body> / html>

  5. 5 Pense em outras maneiras de destacar o texto. Recomendamos que você evite sublinhar para evitar confundir os usuários. Melhor usar a tag em> para deixar o texto em itálico. Use CSS para adicionar outras opções de estilo a esta tag.

    html> head> style> em {color: red; } / style> / head> body> Qualquer coisa no elemento "em" estará em itálico (por padrão) e também em vermelho / em> graças às opções de estilo adicionais. / body> / html>

Método 2 de 2: Método legado

  1. 1 Evite usar as antigas tags u> / u>. Elas estão obsoletas, o que significa que essas tags ainda funcionam, mas estão sendo desencorajadas ou desencorajadas. Isso ocorre porque o HTML não se destina a personalizar o estilo do conteúdo. A tag u> ainda funciona, mas deve representar texto diferente de outro texto, como palavras com erros ortográficos ou nomes próprios chineses.
  2. 2 Use as tags u> / u> para sublinhar os elementos (apenas para demonstração). Dificilmente há um único caso em que você precisa usar essas tags. Pode ser necessário editar o site antigo, portanto, é melhor estar ciente do que são as tags.

    html> body> A antiga tag u> HTML tornou possível sublinhar rapidamente os elementos / u>, mas se outros elementos de estilo fossem tocados, as coisas se tornariam caóticas. Portanto, hoje em dia eles usam o elemento CSS "text-decoration" para sublinhar. / body> / html>

Pontas

  • Quase sempre há uma maneira melhor de destacar o conteúdo de uma página da web do que sublinhando. O sublinhado pode confundir os usuários. Pense em como destacar texto usando CSS.