Multiline Ellipsis

보통 텍스트길이가 지정된 영역을 벗어났을때 말줄임표시 "..."으로 처리 한다.

하지만 보통은 한줄만 가능하고, 여러줄, 2줄이상에 "..."처리를 하려면, 다음처럼 하면 된다.

1. CSS로만 처리 (참고 http://codepen.io/martinwolf/pen/qlFdp)

CSS로만 처리하려면, 다음을 해당 셀렉터에 추가하면 된다.

-webkit-line-clamp: 2; /* 2줄까지만 보여주고 나머진 ... 처리*/

-webkit-box-orient: vertical;

하지만, 보다시피 웹킷브라우저(크롬, 사파리)에서만 처리가능하기때문에 제한적이다.

그래서 다음과 같은 플러그인 사용을 권장한다.

2. Autoellipsis 플러그인 활용

- Alternative text ellipsis - JSFiddle (http://jsfiddle.net/pQLQq/6/)

- jQuery ellipsis (https://plugins.jquery.com/ellipsis/)

- jQuery dotdotdot (http://dotdotdot.frebsite.nl/)