한줄이 길어서 말줄임표 (…) 처리 해주고 싶을 경우

1
2
3
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

멀티라인인 경우

1
2
3
4
5
6
7
.element {
  height: 3em;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
  • Webkit 기반 브라우저 (Chrome, Safari 등)에서 적용 가능하다.