Definición de .text-transform utilizado en CSS
La propiedad .text-transform en CSS controla el caso de texto y la capitalización.
Ejemplo de empleo de text-transform
Esta propiedad de CSS habitualmente se utiliza de la siguiente manera:
.lowercase {
text-transform: lowercase;
}Otro ejemplo más avanzado de .text-transform es el siguiente de CODEPEN:
Sintaxis de .text-transform en CSS
text-transform: none|capitalize|uppercase|lowercase|initial|inherit;Valores
| Valor | Descripción | Manifestación |
|---|---|---|
| ninguna | Sin mayúsculas. El texto se representa tal como es. esto es por defecto | |
| capitalizar | Transforma el primer carácter de cada palabra a mayúscula | |
| mayúscula | Transforma todos los caracteres a mayúsculas | |
| minúsculas | Transforma todos los caracteres a minúsculas | |
| inicial | Establece esta propiedad en su valor predeterminado. | |
| heredar | Hereda esta propiedad de su elemento principal. |
Exploradores compatibles con .text-transform
Los números de la tabla especifican la primera versión del navegador que es completamente compatible con la propiedad.
Los números seguidos de -webkit- especifican la primera versión que funcionó con un prefijo.
| Property | Chrome | Internet Explorer / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| transform (2D) | 36.0 4.0 -webkit- | 10.0 9.0 -ms- | 16.0 3.5 -moz- | 9.0 3.2 -webkit- | 23.0 15.0 -webkit- 10.5 -o- |
| transform (3D) | 36.0 12.0 -webkit- | 12.0 | 10.0 | 9.0 4.0 -webkit- | 23.0 15.0 -webkit- |
Bibliografía
- text-transform at MDN
- text-transform in the W3C Spec
- Notes on the accessibility of uppercase text from WebAIM
