Los datos expuestos en este blog, son solo de índole informativo. Por favor realiza siempre una copia de seguridad antes de realizar cualquier cambio en tu proyecto.
CSS: propiedades de transformación de texto
Este tutorial de CSS explica cómo usar una propiedad de CSS llamada conversión de texto Con sintaxis y ejemplos.
describir
La propiedad de transformación de texto CSS define cómo escribir en mayúsculas el texto de un elemento, por ejemplo, mayúsculas, minúsculas, mayúsculas.
sintaxis
La sintaxis de la propiedad CSS de transformación de texto es:
text-transform: value;parámetro o parámetro
valor
La capitalización de la fuente. Puede ser uno de los siguientes:
| valor | describir |
|---|---|
| capital | Convertir todas las letras a mayúsculas p { conversión de texto: mayúscula; } |
| minúscula | Todas las letras se convierten a minúsculas. p { conversión de texto: minúsculas; } |
| capital | Convierte la primera letra de cada palabra a mayúscula p { conversión de texto: mayúscula; } |
| no cualquiera | Las letras mayúsculas y minúsculas permanecen sin cambios p { conversión de texto: ninguna; } |
| heredar | El elemento heredará la transformación de texto de su elemento principal p { conversión de texto: herencia; } |
notas
- Si se selecciona el uso de mayúsculas como la transformación del texto, la primera letra de cada palabra se escribe en mayúscula, dejando todas las demás letras sin cambios.
- La propiedad de transformación de texto CSS es una excelente manera de poner títulos en mayúsculas sin editar la página HTML.
Compatibilidad del navegador
La propiedad de transformación de texto CSS tiene soporte básico para los siguientes navegadores:
- Aleación de cromo
- androide
- Firefox (Geco)
- Firefox móvil (Geco)
- Navegador de Internet (IE)
- es decir, móvil
- ópera
- Ópera Móvil
- Safari (WebKit)
- Safari para móvil
ejemplo
Discutiremos la propiedad de transformación de texto a continuación, explorando ejemplos de cómo usar esta propiedad en CSS.
usar mayúsculas
Veamos un ejemplo de transformación de texto CSS donde configuramos la transformación de texto en mayúsculas.
h1 { text-transform: uppercase; }En este ejemplo de transformación de texto CSS, usamos la propiedad de transformación de texto CSS para convertir
Todo el texto de las etiquetas se cambia a mayúsculas.Esto le permite hacer cambios rápidos
El marcado se muestra sin editar la página HTML.
usar minúsculas
Veamos un ejemplo de transformación de texto CSS donde configuramos la transformación de texto en minúsculas.
span { text-transform: lowercase; }En este ejemplo de transformación de texto CSS, usamos la propiedad de transformación de texto CSS para convertir Todo el texto de la etiqueta se cambia a minúsculas.
usar mayúsculas
Veamos un ejemplo de transformación de texto CSS donde configuramos la transformación de texto en mayúsculas.
.author_name { text-transform: capitalize; }En este ejemplo de transformación de texto CSS, ponemos en mayúscula la primera letra de cada palabra en el texto de la clase nombre_autor usando la propiedad de transformación de texto CSS.