Tutoriais HTML/CSS CSS A propriedade CSS Text-transform
CSS
A propriedade CSS Text-transform
A propriedade text-transform realiza transformações no formato caixa-alta ou caixa-baixa do texto.
Sintaxe:
text-transform: capitalize
text-transform: uppercase
text-transform: lowercase
text-transform: none (valor default)
Exemplos:
h1 {text-transform: capitalize}
Capitalize coloca a primeira letra de cada palavra em maiúsculas. Uppercase coloca tudo em maiúsculas e lowercase coloca tudo em minúsculas. None remove qualquer transformação deixando o texto da forma como foi definido antes das transformações.
<html>
<head>
<style>
p {font-weight: bold}
span {font-weight: normal}
.non {text-transform: none}
.upp {text-transform: uppercase}
.cap {text-transform: capitalize}
.low {text-transform: lowercase}
</style>
</head>
<body>
<p>Sem transformação: <span>Precisamos conhecer bem HTML e CSS</span></p>
<p>Uppercase: <span>Precisamos conhecer bem HTML e CSS</span></p>
<p>Capitalize: <span>Precisamos conhecer bem HTML e CSS</span></p>
<p>Lowercase: <span>Precisamos conhecer bem HTML e CSS</span></p>
</body>
</html>
Fica assim:
