Blog do Rikáryo

Uma coisa tão simples e muita gente vive me enviando e-mail solicitando ajuda com a propriedade das fontes em seus trabalhos web. A propriedade que vou falar nesse artigo é a “text-transform” usada para mudar um texto de maiúscula para minúscula ou vice-versa, pode ser usada ainda para aplicar a inicial das palavras em maiúscula.

Letras maiúsculas devem ser usadas em pontos estratégicos do seu documento HTML e nunca no site todo, a menos que o projeto do seu site já tenha previsto isto, caso contrário apenas títulos ou pequenas partes do texto devem ser em letras maiúsculas.

O text-transform deve ser aplicado em tags de textos, como o p, h1, h2, h3, span, a, li entre outros e pode ser usado de quatro formas diferentes, vamos a elas:

h1{

text-transform: uppercase;

}

A tag h1 terá seu conteúdo todo em letras maiúscula, como no exemplo abaixo:

LETRAS MAIÚSCULAS EM CSS COM TEXT-TRANSFORM: UPPERCASE

h2{

text-transform: lowercase;

}

A tag h2 terá seu conteúdo todo em letras minúscula, como no exemplo abaixo:

texto em css com letras minúsculas. propriedade text-transform: lowercase

h3{

text-transform: capitalize;

}

A tag h3 ficará com a inicial maiúscula para todas as palavras, como no exemplo abaixo:

Exemplo De Texto Formatado Com Text-transform: Capitalize

h2{

text-transform: none;

}

Este quarto exemplo deve ser usado apenas para neutralizar um uso anterior do text-transform, ou seja, supondo que exista no início do documento CSS uma formatação com text-transform: uppercase e no final você queira neutralizar esta formatação, então basta usar o text-transform:none.

São dicas simples de como usar o texto em seus projetos que podem fazer a diferença.