Definición de .text-overflow en CSS
La propiedad .text-overflow en CSS se ocupa de situaciones en las que el texto se recorta cuando desborda el cuadro del elemento. Se puede recortar (es decir, cortar, ocultar), mostrar un elipsis («…», valor de rango unicode u+2026) o mostrar una cadena definida por el autor (no hay soporte de navegador actual para cadenas definidas por autor).
Ejemplo de empleo de la propiedad text-overflow
Si te gustaría emplear esta propiedad de CSS en tu hoja styles.css, hazlo de la siguiente manera:
.ellipsis {
text-overflow: ellipsis;
/* Required for text-overflow to do anything */
white-space: nowrap;
overflow: hidden;
}Sintaxis de .text-overflow en CSS
text-overflow: clip|ellipsis|string|initial|inherit;Valores
| Valor | Descripción | Manifestación |
|---|---|---|
| acortar | Valor por defecto. El texto está recortado y no es accesible. | |
| elipsis | Representar puntos suspensivos ("…") para representar el texto recortado | |
| cuerda | Representar la cadena dada para representar el texto recortado | |
| inicial | Establece esta propiedad en su valor predeterminado. | |
| heredar | Hereda esta propiedad de su elemento principal. |
Exploradores compatibles con .text-overflow
Los números de la tabla especifican la primera versión del navegador que es absolutamente compatible con la propiedad.
Los números seguidos de -webkit- detallan la primera versión que funcionó con un prefijo.
| Property | Chrome | Internet Explorer / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| text-shadow | 4.0 | 10.0 | 3.5 | 4.0 | 9.6 |
