2010-10-11 44 views
11

posibles duplicados:
Is it possible to implement the effect of overflow:ellipsis with javascript or css?
How do I indicate long text into a smaller fixed column with CSS?CSS: Cómo limitar el texto se muestra con el uso de "..."

quiero para recortar el texto si es superior a 300 px de ancho, con "..."

Por ejemplo, si tuviera:

<ul> 
<li>this is greater than 300px, than only display as much of the text that is 300px wide and then replace the remaining text with "..."</li> 
<li>short, don't trim</li> 
</ul> 

mostraría como:

this is greater than 300px, than only ... 
short, don't trim 
|----------- 300px wide ----------------| 

¿Cómo iba a hacerlo con CSS/HTML?

+1

posible duplicado de [¿Es posible implementar el efecto de desbordamiento:? Elipsis con javascript o CSS] (http://stackoverflow.com/questions/2995656/) y http://stackoverflow.com/questions/3067696 y http://stackoverflow.com/questions/802175/ y http://stackoverflow.com/questions/486563/ man I Estoy aburrido de esta pregunta –

+0

He intentado lo anterior y no funcionó con ** puro ** CSS/HTML. Solo funcionó si utilicé JQuery y no quiero usar JQuery. – Jason

+0

** Esto podría ser un duplicado PERO no he encontrado una respuesta pura de CSS/HTML que FUNCIONE. Ha habido sugerencias para usar código como vinculado pero ese código NO funciona. ** http://stackoverflow.com/questions/2108740/how-do-i-indicate-long-text-into-a-smaller-fixed- column-with-css/2109035 # 2109035 – Jason

Respuesta

11
+0

Intenté lo anterior y no funcionó con ** pure ** CSS/HTML. Solo funcionó si utilicé JQuery y no quiero usar JQuery. – Jason

+0

@Jason Puede implementar eso usando JS "nativo", pero es más corto con jQuery –

+0

No estoy buscando una solución JS, estoy buscando una solución que use CSS/HTML puro – Jason

Cuestiones relacionadas