Dominando a Seleção de Texto Personalizada com CSS

Introdução

Neste laboratório, exploraremos o mundo da programação CSS e aprenderemos a estilizar páginas web usando várias propriedades e seletores CSS. O objetivo deste laboratório é fornecer experiência prática para desenvolvedores iniciantes e de nível intermediário, aprimorando suas habilidades na criação de páginas web visualmente atraentes. Através deste laboratório, você também aprenderá a solucionar problemas comuns de CSS e a usar as melhores práticas em sua codificação.

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.

Seleção de Texto Personalizada

index.html e style.css já foram fornecidos na VM.

Para modificar o estilo do texto selecionado, utilize o pseudo-seletor ::selection. Aqui está um exemplo de trecho de código para selecionar e estilizar texto dentro de um elemento de parágrafo:

<p class="custom-text-selection">Select some of this text.</p>

::selection {
  background: aquamarine;
  color: black;
}

.custom-text-selection::selection {
  background: deeppink;
  color: white;
}

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.

Resumo

Parabéns! Você concluiu o laboratório de Seleção de Texto Personalizada. Você pode praticar mais laboratórios no LabEx para aprimorar suas habilidades.