Warning: Attempt to read property "image_fulltext" on null in /home/krmp/rikaryo.com.br/templates/ja_blockk/html/com_content/article/default.php on line 32

Warning: Attempt to read property "image_fulltext" on null in /home/krmp/rikaryo.com.br/templates/ja_blockk/html/com_content/article/default.php on line 36

Warning: Attempt to read property "image_fulltext" on null in /home/krmp/rikaryo.com.br/templates/ja_blockk/html/com_content/article/default.php on line 43

Warning: Attempt to read property "image_fulltext" on null in /home/krmp/rikaryo.com.br/templates/ja_blockk/html/mod_jacontentlisting/details/default-03/index.php on line 39

Warning: Attempt to read property "image_fulltext" on null in /home/krmp/rikaryo.com.br/templates/ja_blockk/html/mod_jacontentlisting/details/default-03/index.php on line 41
/home/krmp/rikaryo.com.br/templates/ja_blockk/html/mod_jacontentlisting/details/default-03/index.php on line 63
https://www.rikaryo.com.br/');" >

Text-transform: maiúsculas e minúsculas em CSS

Imagem ilustrativaUma 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.