글자길때 ... ellipsis 만들기

방법1.

일반적으로 그냥 한줄짜리 ellipsis는 간단하다

text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;

이렇게 하면 된다.

방법2.

하지만 만약 여러줄의 긴 문장들의 몇번째 줄부터 ...을 주고 싶다면 아래와 같이 하면 된다.

word-break: break-all;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;

-webkit-line-clamp가 몇번째에 ellipsis를 줄 것인지 판단해준다.

방법3.

특정 글자수에 따라 맞춰주고 싶을때는 substring(0,200) 같은 함수를 써서 자바스크립트에서 처리해줘도 된다.