Una útil propiedad de CSS, y puede que desconocida por algunos es text-transform.

Con text-transform podemos controlar las letras de un elemento. Los posibles valores que puede tomar text-transform son:

  1. p{
  2. text-transform: none;
  3. text-transform: capitalize;
  4. text-transform: uppercase;
  5. text-transform: lowercase;
  6. }

El valor none dejará el texto tal cual lo hayamos escrito.
Con capitalize, cada letra del texto empezará con mayúsculas.
uppercase convierte todo el texto en mayúsculas.
lowercase convierte todo el texto en minúsculas.

Como veis, text-transform es una propiedad sencilla y facil de utilizar, pero que puede ayudarnos sobre todo cuando trabajamos con varios idiomas, y recojemos los textos de un fichero externo. Supongamos que tenemos el título de una sección (contacto). En la barra de navegación principal queremos tenerlo en mayúsculas, para que resalte más; mientras que en el resto del documento nos interesa que esté en minúsculas. Con un simple text-transform: uppercase ó text-transform: lowercase solucionamos el problema, sin tener que duplicar la entrada en el fichero donde recogemos los datos.

Y vosotros, ¿que otros usos le dais a la propiedad CSS text-transform?

Comparte esta entrada:
  • Digg
  • BlinkList
  • del.icio.us
  • BarraPunto
  • Google
  • Meneame
  • Technorati
  • E-mail this story to a friend!
  • Facebook
  • MisterWong
  • TwitThis

Si eres nuevo, puedes subscribirte a nuestras noticias por RSS feed. Gracias por tu visita!