공백 없이 요소 안에 텍스트를 어떻게 배치합니까?

공백이 없는 요소? " />

텍스트 내에 공백을 허용하지 않고 요소 내부에서 텍스트를 감싸려면 다음과 같이 하세요. 연속적인 문자 시퀀스의 경우 여러 CSS 속성을 활용할 수 있습니다.

단어 분리: break-all 속성을 사용하면 문자 내에서도 단어를 끊을 수 있습니다. 그러나 이 속성만으로는 모든 브라우저에서 충분하지 않을 수 있습니다.

호환성을 보장하고 원하는 래핑 동작을 달성하려면 다음과 같은 추가 속성의 조합을 적용할 수 있습니다. 🎜>

공백: -moz-pre-wrap !important;: Mozilla 브라우저
• 공백: -webkit-pre-wrap;: Chrome 및 Safari 브라우저
• white-space: -pre-wrap;: Opera 4-6 브라우저
• white-space: -o-pre-wrap; : Opera 7 브라우저
• white-space: pre-wrap;: CSS3 호환 브라우저
• word-wrap: break-word;: Internet Explorer 5.5 브라우저

또한 모든 브라우저에서 올바른 래핑을 보장하기 위해 공백: 일반; 속성을 최종 선언으로 포함해야 합니다.

이 솔루션을 구현하려면 다음 CSS 클래스를 요소:

.wrapword {
    white-space: -moz-pre-wrap !important;  
    white-space: -webkit-pre-wrap;          
    white-space: -pre-wrap;                 
    white-space: -o-pre-wrap;               
    white-space: pre-wrap;                  
    word-wrap: break-word;                  
    word-break: break-all;
    white-space: normal;
}

그런 다음 감싸고 싶은 텍스트를 class="wrapword" 속성이 있는 요소:

위 내용은 공백 없이 요소 안에 텍스트를 어떻게 배치합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!