글자를 고정된 위치를 기준으로 자르고 싶습니다. 오차범위가 좀 있더라도...
조회수 575회
asfsdagsagfsagfsdgh
gsagsdfadgsdhfdgsd
afgsdghdfhsdgsdgasd
대충 저리 3줄이 있다 쳤을때
asfsdagsagfsagfsdgh
gsagsdfadgsdhfdgsd
afgsdghdfh
한 이정도 쯤으로 자르고 싶은대 어떻게 해야할 지 모르겠습니다.
단순히 글자수로만 자르면 특수기호나 대문자, 공백 같은게 다 들어가 있다보니까 3줄째에서 자르고 싶어도 4줄로 넘어간다던지 2줄쨰에서 잘린다던지 하더라고요... 3줄 째란 범위를 넘지 않게 하고 싶은대 어떻게 해야하나요?
-
(•́ ✖ •̀)
알 수 없는 사용자
1 답변
-
스택 오버플로우가 체고시죠.
https://stackoverflow.com/questions/33058004/applying-an-ellipsis-to-multiline-text
아래의 아티클도 볼만 합니다.
https://css-tricks.com/line-clampin/
개인적으로는 CSS보다는 js로 컨트롤하는 라이브러리를 사용하는 것이 좀 더 robust하다고 생각되서...
원래는 dotdotdot 이라는 유명한 라이브러리가 있지만 상업적 용도로 사용하려면 비용을 지불해야 하는것 같더라고요. http://dotdotdot.frebsite.nl/
무료인 경우에는 clamp.js가 좋아 보이네요. https://github.com/josephschmitt/Clamp.js
- clamp.js 사용할 때 truncationChar 나 truncationHTML 어떻게 쓰나요? 알 수 없는 사용자 2019.4.22 22:06
- useNativeClamp: false 옵션을 같이 주고 하셔야 합니다. 그런데 폰트 종류에 따라 제대로 반응하지 않네요. dotdotdot은 잘 되려나... doodoji 2019.4.23 13:27
- userNativeClamp를 false로 설정하면 children쪽에서 오류난다고.. 흐.... 왜나는건지 모르겠어요.. 알 수 없는 사용자 2019.4.23 15:56
- https://codepen.io/digda/pen/OGojpv Clamp.js Way 항목 참고해 보세요. doodoji 2019.4.23 19:10
- 감사합니다! 알 수 없는 사용자 2019.4.24 18:01
댓글 입력