Este artigo o guiará sobre a mudança de conteúdo no CSS.
Como alterar o conteúdo no CSS?
Para alterar o conteúdo no CSS, usaremos os métodos abaixo:
Vamos passar por cada método um por um!
Método 1: Use :: After Selector With Content Property para alterar o conteúdo no CSS
O "::depois”Seletor coloca o conteúdo especificado após o elemento HTML usando o CSS“contente" propriedade. Esta operação ajuda a adicionar o conteúdo ao elemento selecionado. Além disso, o “mostrar”A propriedade pode ser utilizada para ocultar o conteúdo existente.
Vamos dar uma olhada no exemplo abaixo para entender como alterar o conteúdo no CSS usando o :: após seletor.
Exemplo
Aqui está a nossa página HTML com o texto “Bom dia!!!”. Vamos substituir o conteúdo adicionado:
Atualmente, adicionamos um “ Bom dia!!! Em nosso arquivo CSS, agora usaremos o :: após seletor como “corpo :: depois”E use o“contente”Propriedade com o valor“Boa noite”Dentro de sua definição. Como resultado, o seletor CSS colocará o texto logo após o texto escrito. Por fim, oculte o texto existente usando o “mostrar”Propriedade e defina seu valor como“nenhum”: Agora, salve seu arquivo HTML e simplesmente abra -o no navegador ou use “Servidor ao vivo”Para o mesmo propósito: Como você pode ver, o conteúdo foi alterado usando com sucesso o seletor :: após o CSS: Método 2: Use :: Antes do Seletor com Propriedade de Conteúdo para Alterar o Conteúdo no CSS No CSS, o “::antes”O seletor é utilizado para fazer o conteúdo aparecer logo antes do conteúdo existente de um elemento. Pode ser usado em combinação com o “contente”Propriedade para adicionar novo conteúdo ao elemento selecionado. Exemplo Especifique o :: antes do seletor logo após o corpo como “corpo :: antes”. Isso colocará o novo conteúdo antes do conteúdo existente. Observe que todas as outras propriedades permanecem as mesmas do exemplo anterior: Saída Explicamos métodos diferentes para alterar o conteúdo no CSS. Conclusão Para mudar o conteúdo, “::depois" e "::antes”Os seletores CSS são usados com o“contente" propriedade. Na primeira abordagem, o texto especificado é adicionado após o elemento selecionado, enquanto o segundo seletor de CSS funciona oposto. Além disso, o “mostrar”A propriedade pode ser utilizada para ocultar o conteúdo existente de um elemento. É assim que o conteúdo é alterado completamente no CSS. Cobrimos os dois métodos de alteração do conteúdo no CSS.