Como Criar Texto Tachado em HTML - Tutorial

Introdução

Em HTML, a tag <s> representa texto tachado ou texto com uma linha através dele. Pode ser usada para mostrar conteúdo textual irrelevante ou que não é mais preciso. É essencial usar a tag <del> em vez da tag <s> para fins de edição de documentos. Neste laboratório, você aprenderá como criar texto tachado em HTML usando a tag <s>.

Nota: Você pode praticar a codificação em index.html e aprender Como Escrever HTML no Visual Studio Code. Por favor, clique em 'Go Live' no canto inferior direito para executar o serviço web na porta 8080. Em seguida, você pode atualizar a aba Web 8080 para visualizar a página web.

Este é um Lab Guiado, que fornece instruções passo a passo para ajudá-lo a aprender e praticar. Siga as instruções cuidadosamente para completar cada etapa e ganhar experiência prática. Dados históricos mostram que este é um laboratório de nível iniciante com uma taxa de conclusão de 100%. Recebeu uma taxa de avaliações positivas de 100% dos estudantes.

Criar um arquivo HTML básico

Crie um arquivo HTML chamado index.html. Veja como criar uma estrutura HTML básica:

<!doctype html>
<html>
  <head>
    <title>Criando um Texto Tachado em HTML</title>
  </head>
  <body>
    <!-- Seu código HTML irá aqui -->
  </body>
</html>

Adicionar um Texto Tachado

Dentro da tag body do seu arquivo HTML, adicione a tag <s> que representa texto tachado. Veja como escrever a sintaxe básica:

<s>Este texto tem um tachado.</s>

Você verá o texto acima com uma linha através dele na sua saída HTML.

Adicionar um atributo

Embora a tag <s> não tenha nenhum atributo específico, ela suporta tanto atributos globais quanto de evento. Veja como adicionar um atributo de evento à tag <s>:

<s onclick="alert('Este é um texto tachado.')">Clique em mim!</s>

No código acima, o atributo de evento onclick exibirá uma mensagem de alerta com o texto quando você clicar no texto tachado.

Adicionar estilos CSS

Você também pode adicionar estilos CSS personalizados para alterar a aparência do texto tachado. Veja como adicionar estilos CSS à tag <s>:

<style>
  s {
    text-decoration: line-through;
    color: red;
    font-size: 20px;
  }
</style>

No código acima, a propriedade text-decoration cria o tachado, a propriedade color muda a cor da fonte para vermelho, e a propriedade font-size define o tamanho da fonte para 20px.

Resumo

Neste laboratório, você aprendeu como criar texto tachado em HTML usando a tag <s>. Você pode personalizar a aparência do texto adicionando estilos CSS ou atributos de evento. A tag <s> é perfeita para indicar texto que não é mais preciso ou relevante e também pode ser útil para fins de edição de documentos.