CSS3: text-overflow
Publicado el Domingo 11 de Febrero del 2007 @ 4:01 por Armonth.
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.
5 Comentarios (feed)
-
corsaria nos comenta:
Vaya celebración más friki. Aunque más lo sería si cambias las hamburguesas por tortilla de patatas. :P
Mmm ahora a saber que navegadores soportan css3. :-) -
ToniV/kosikas nos comenta:
Las celebraciones friki molan!!!
para la proxima invito yo a las hamburguesas. ;-)CSS3 !!? el Explorer xDD
-
InKiLiNo nos comenta:
Cumpleaños de quien???
No será el tuyo ¿no?
por si acaso felicidades ;)
-
Federico nos comenta:
Te faltó
text-overflow: ellipsis-word. :) -
Armonth nos comenta:
Federico, corregido…
Inkilino: ¿entrada equivocada?…
