css … 말 줄임 처리, 생략 처리, ellipsis에 대해
알아보겠습니다~!
홈페이지나 기타 사이트에서 많이 보셨을텐데요
글 제목이 길어졌을 때 말줄임(?)이라고 해야하나요
글이 더 있다는 표시 ... 를 CSS로 처리하는 방법을 알아보겠습니다~
굉장히 간단합니다~!
- css
.summary {
width:200px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
말줄임을 사용할 영역에 width 값과 함께 위 옵션을 적용하면 쉽게 사용할 수 있습니다.- 예제보기