Ao escrever qualquer artigo ou documento, geralmente precisamos de alguns personagens para estar em casos específicos. Em uma página da web, o elemento HTML cujo texto exige ser transformado é aplicado com a propriedade CSS “transformação de texto”. Esta propriedade também economiza tempo de tal maneira que, depois de adicionar todos os personagens, o caso deles pode ser transformado de uma vez.

Esta posta. Então vamos começar!

Como fazer um texto em maiúsculas e minúsculas usando CSS?

No CSS, o “transformação de texto”A propriedade controla a capitalização do texto. Também é utilizado para converter texto em maiúsculas ou minúsculas.

Valores da propriedade de transformação de texto

Os valores possíveis da propriedade CSS TRANSForm Text estão listados abaixo:

• • ““maiúsculas”: Este valor torna todos os caracteres no texto do elemento capitalizado.
  • ““minúsculo”: Este valor altera o texto do elemento para minúsculas.
  • ““capitalizar”: Este valor altera a primeira letra de cada palavra capitalizada.
  • ““nenhum”: Este valor restringe o texto do elemento para modificação.
  • ““inicial”: Este valor define o valor padrão.
  • ““herdar”: Este valor define seu valor de seu elemento pai.

Analise o exemplo abaixo!

Exemplo: transformando o texto em maiúsculas e minúsculas

Primeiro, adicione um elemento div com o nome da classe “caixa”. Dentro do corpo, adicione três tags de título

,

, e

, onde o texto do

O cabeçalho está tudo em maiúsculas,

está em minúsculas e o terceiro também está em minúsculas.

Abaixo está o código HTML:

minúsculo: bem -vindo ao linuxhint

Uppercase: Bem -vindo ao Linuxhint

Capitalize: Bem -vindo ao Linuxhint

Caixa de estilo div

.caixa
Altura: 200px;
largura: 80%;
borda: 4px sólido #e4cfcf;
Background-Color: CadetBlue;
margem: 1px automático;
preenchimento: 10px;

A div criada no arquivo HTML acima está agora estilizada com propriedades CSS que são explicadas abaixo:

• • ““altura”É utilizado para definir a altura da div.
  • ““largura”É utilizado para definir a largura do div.
  • ““fronteira”A propriedade é utilizada para aplicar a borda ao redor do elemento, que tem 4px de largura, tipo de linha sólida e cor e4cfcf.
  • ““cor de fundo”Especifica a cor de fundo do elemento.
  • ““margem”A propriedade ajusta o espaço em todos os lados do elemento.
  • ““preenchimento”A propriedade é utilizada para produzir espaço em torno do conteúdo do elemento div ou dentro da borda do elemento.

Os blocos de código abaixo indicam que todos os elementos de título são estilizados com diferentes valores das propriedades de transformação de texto. O

O elemento é aplicado com a transformação de texto da propriedade com o valor definido como “minúsculo”:

H1
transformação de texto: minúscula;

O

O elemento é aplicado com a propriedade de transformação de texto com o valor definido como “maiúsculas”:

H2
TRANSFORMA DE TEXTO: OUPERCASE;

Para

Elemento, o valor da propriedade de transformação de texto é definido como “capitalizar”:

H3
TRANSFORMA DE TEXTO: capitalizar;

Ao fornecer o código acima mencionado, o texto do primeiro cabeçalho é todo transformado em letras minúsculas e a segunda direção para a maçaneta. Enquanto a primeira letra de cada palavra é capitalizada no terceiro título:

Ótimo! Aprendemos com sucesso a transformar o texto em maiúsculas, minúsculas e todos capitalizados.

Conclusão

A propriedade de transformação de texto do CSS controla a capitalização do texto e é utilizada para alterar os casos do texto do documento. Esta propriedade se aplica a todos os elementos, onde os valores dessa propriedade podem ser maiúsculos, minúsculos, capitalizar. Este blog explicou o procedimento de conversão de texto em maiúsculas e minúsculas usando a propriedade CSS Transform.