CSS3: Text-overflow
Postado em: 26 de fevereiro de 2007 por Pedro RogérioA cada dia eu fico mais surpreendido com o poder do CSS, e uma propriedade muito interessante do CSS3 que está por vir é o text-overflow, onde ele nos dá a possibilidade de recortar o texto que por exemplo não cabe dentro de um box, e para nos ajudar mais ainda, ele coloca no final da frase 3 pontinhos(…), característica para dizer de que a frase continua. As propriedades disponíveis são as seguintes:
- text-overflow: ellipsis-word;
- text-overflow: clip;
Por exemplo, se pegasse-mos o seguinte texto:
Lorem ipsum dolor sit amet, consectetur
E utilizasse-mos o text-overflow, ele seria renderizado da seguinte forma:
Lorem ipsum dolor sit…
Dessa forma é possível fazer resumos sem usar sequer nenhuma linguagem de programação.
Rael B. Riolino disse: 27.02.07 ás 07:55
Muito bom!
O CSS realmente vai quebrar um galhão pra nós… um dos principais recursos que eu aguardo no CSS3 é a insersão multipla de imagens como background…
Agora vamos ver se a microsoft vai fazer sua lição de casa direitinho… :-S
Israel Cefrin disse: 27.02.07 ás 09:28
Muito interessante mesmo.
Esse comportamento de reticências é formatação e deve mesmo ser controladao pelo CSS. Assim como aspas e outros elementos de mesmo objetivo(formatação de texto).
E como disse o amigo acima, tomara que a MS faça seu dever de casa para que n´so não o tenhamos de fazer no lugar dela.
Nandocot disse: 27.02.07 ás 10:04
Muito bom mesmo, confesso que não sabia….
Vlw Pedro
Túlio Vargas disse: 27.02.07 ás 19:06
mas nao tem q colocar o limite até quantos caractéres ?
[]´s
Pedro Rogério disse: 27.02.07 ás 21:08
Túlio,
Não é necessário, veja um exemplo aqui:
http://www.w3.org/TR/2001/WD-css3-text-20010517/#text-overflow
Virginia disse: 04.09.07 ás 16:02
Não existe uma maneira de fazer isso com o CSS2?
Pedro Rogério disse: 05.09.07 ás 18:44
@ Virginia,
Até hoje não vi coisa parecida, não sei nem se com JavaScript é possível fazer isso. Abraços!!!