말줄임처리 css 채택완료
게시판글 본문을 목록에서 요약하여 보여주고싶은데
어떤글은 2줄로 떨어져서 말줄임되고
어떤글은 1줄에서 말줄임되고
어떤포인트에서 말줄임이 되는지 모르겠지만 자동으로 처리가 됩니다.
그래서 제가 억지로 일괄 3줄 말줄임처리를 해보려했으나 먹히지가 않습니다,,
본문글을 요약으로 가져오는 개발쪽의 일인가요 ??
아니면 css로 해결 가능한지 고수님들 답변 부탁드립니다.
아래 주소 남겨봅니다 ,,
https://creativity.connectvalue.net/contents/fanPage/board/knowhowList.asp?page_str_menu=0">https://creativity.connectvalue.net/contents/fanPage/board/knowhowList.asp?page_str_menu=0
답변 3개
개발단에서 cut_str 로 가져와서 보여주고 있다면.. 말줄임 css 적용이 효과가 없습니다.
개발단에서 cut_str 로 가져오는 부분을.. -> 전부 가져오는 것으로 수정후에..
=> 말줄임 css 적용
순서로 처리해주면 됩니다.
댓글을 작성하려면 로그인이 필요합니다.
댓글을 작성하려면 로그인이 필요합니다.
한줄로 말줄임 하는건
</p>
<p><style></p>
<p>.ex {text-overflow: ellipsis; white-space: nowrap; word-break: break-all; overflow: hidden;}</p>
<p></style></p>
<p>위와 같습니다.
두줄 이상은
</p>
<p><style></p>
<p>.ex {height: 54px; text-overflow: ellipsis; overflow: hidden; display: block; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}</p>
<p></style></p>
<p>위와 같습니다. 여기서 height 은 2줄 3줄 4줄 5줄... 이렇게 표현되는 높이에 따라 맞춰주면 되고,
-webkit-line-clamp: 2; 여기 숫자가 줄수 입니다.
익스에선 말줄임 표시가 안되는 단점이 있지만, 유용한 css 입니다.
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인