🥇 Como fazer o corte na linha / título. usando apenas CSS

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

Related Posts