Solución:
Puede utilizar una propiedad CSS simple para su elemento “text-overflow: ellipsis;” para usar esta propiedad de manera efectiva, debe aplicar algunas propiedades relacionadas junto con eso.
Por ejemplo:
<div style="width: 50px; text-overflow: ellipsis; white-space: nowrap;
overflow: hidden;">Some text goes here</div>
* Probado en Chrome.
Necesitará algo de javascript para crear un intervalo alrededor de los últimos 120 caracteres que los oculte. Hay un atributo CSS “visibilidad: oculta” que se puede aplicar al tramo.
Algo así debería ser el resultado:
<div>first 40 chars <span style="visibility:hidden">last 120 chars</span></div>
Si desea recortar el div a un cierto tamaño, en lugar de un número exacto de caracteres, puede simplemente darle al div el tamaño que desee y especificar overflow: hidden para recortar el contenido que no encaja.
Si se asegura de que la altura del div sea una multitud de la altura de la línea del texto, no tendrá el contenido recortado en el medio (vertical) de una línea.