CSS의 중국어 텍스트가 div를 초과하면 어떻게 해야 합니까?

CSS의 중국어 텍스트가 div를 초과하는 해결 방법은 div에 Overflow, word-break 및 word-wrap 속성을 추가하고 속성 값을 hide, break-all 및 break-로 설정하는 것입니다. 각각 말입니다.

이 기사의 운영 환경: windows10 시스템, CSS 3, thinkpad t480 컴퓨터.

div에 텍스트 문자열을 입력했는데 아래 그림과 같이 텍스트 내용이 그 값을 초과했습니다.

이제 추가 텍스트를 자동으로 줄바꿈하려면 어떻게 해야 합니까? 아래 사진?

사용된 속성:

overflow 속성은 콘텐츠가 요소 상자를 오버플로할 때 발생하는 상황을 지정합니다.

• 숨겨진 내용은 잘리고 나머지 내용은 보이지 않게 됩니다.

word-break 속성은 자동 줄 바꿈 처리 방법을 지정합니다.

• break-all은 단어 내에서 줄 바꿈을 허용합니다.

word-wrap 속성을 사용하면 긴 내용을 자동으로 줄 바꿈할 수 있습니다.

• break-word 긴 단어나 URL 주소 안의 줄을 바꿉니다.

구체적인 구현 코드는 다음과 같습니다.

html:

<div class="dbubble-text">
    nishi shfishfshfscccccccccccccccccccifhsssfffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff
 </div>

css:

.dbubble-text {
display: inline-block;
font-size: 14px;
color: #303030;
line-height: 1.6;
font-family: "微软雅黑";
width: 200px;
word-wrap: break-word;
word-break: break-all;
overflow: hidden;
}

학습 영상 공유: css 영상 튜토리얼

위 내용은 CSS의 중국어 텍스트가 div를 초과하면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!