Este é um exemplo de como fazer o recorte de um título longo, usando apenas CSS.
usando este estilo de CSS, ao final do título será adicionado “…” quando não houver espaço suficiente para o texto.
<style>
h1{
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
</style>
você pode ver aqui no exemplo um longo título de tag HTML H1.
<h1>this is very long long title with a lot of text this is very long long title with a lot of text this is very long long title with a lot of text <h1>
Ao usar o css na parte superior, ficará recortado com “…” no final do texto.
notas: <br>
1. Funciona em todos os navegadores (Internet Explorer 7 e superior). <br>
2. Você pode usá-lo apenas se quiser que o texto quebre após uma linha. não vai funcionar, quando você quiser fazer o corte depois de 2 carreiras e acima, apenas uma carreira!
EXEMPLO AO VIVO:
Link