텍스트 오버플로를 사용하여 하이픈 넣기를 방지하는 방법
P粉464208937
P粉464208937 2023-09-03 15:00:49
0
1
509

일부 타이틀에 최대 줄 수를 설정하려고 하는데, 가끔 줄이 하이픈으로 끝나는 경우가 있다는 것이 문제입니다. 나에게 필요한 것은 단어를 끊어야 하는 경우 완전히 숨겨야 하고 이전 단어 뒤에 줄임표를 배치해야 한다는 것입니다.

이 코드는 문제를 보여줍니다.

#head { 너비:300px; 글꼴 크기: 20px; 디스플레이: -webkit-box !important; 색상: #000000 !중요; 텍스트 오버플로: 줄임표 !important; -webkit-line-clamp: 4 !중요; -webkit-box-orient: 수직!중요; 오버플로: 숨겨진 !중요; }
   

"ever"라는 단어에 공백이 있는데 어떻게든 이런 일이 발생하지 않도록 할 수 있나요?

P粉464208937
P粉464208937

모든 응답 (1)
P粉231112437

하이픈 연결을 완전히 숨기고 이전 단어 뒤에 줄임표를 넣으려면 JavaScript를 사용하여 텍스트 내용을 조작할 수 있습니다. 이를 달성하기 위해 코드를 수정하는 방법의 예는 다음과 같습니다.

으아악 으아악 으아악

이 코드에서는 JavaScript 함수truncateText를 사용하여 지정된 최대 길이를 초과하는 텍스트 내용을 자릅니다. 이 함수는 최대 길이 내에서 마지막 공백 문자를 찾아 나머지 텍스트를 타원으로 바꿉니다.

줄임표를 추가하기 전에maxLength매개변수를 원하는 문자 수로 조정할 수 있습니다.

    최신 다운로드
    더>
    웹 효과
    웹사이트 소스 코드
    웹사이트 자료
    프론트엔드 템플릿
    회사 소개 부인 성명 Sitemap
    PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!