CSS3: text-overflow

Autor: Armonth | El domingo 11 de febrero del 2007 @ 04:01.

Después de celebración "friki" de cumpleaños con hamburguesas, PS2, NeoGeo Battle Coliseum, Tekken 5 y algo de Anime (Karas y City Hunter'91) toca entrada que si no os "des-malacostumbro".

En Webéame leo sobre text-overflow una de esas novedades curiosas que vendrán en CSS3.

En pocas palabras, permite limitar la cantidad de texto dentro de un "box" de forma fácil añadiendo unos puntos suspensivos. Repito el ejemplo que dan, el texto:

Lorem ipsum dolor sit amet, consectetur

Está dentro de una caja en la que cabe hasta "ame" así que la palabra queda cortada al faltar la "t", pero añadiendo esta propiedad de CSS3 (todavía beta):

text-overflow: ellipsis-word;

Y posiblemente:

text-overflow: clip;

La palabra no se cortará y se eliminará sustituyendose por la palabra anterior más unos puntos suspensivos:

Lorem ipsum dolor sit...

De esta forma se pueden hacer resumenes de forma sencilla sin tener que cortar textos ni usar lenguajes de programación.

Comentarios