>웹 프론트엔드 >CSS 튜토리얼 >모든 브라우저에서 표 셀의 텍스트 줄 바꿈을 보장하는 방법은 무엇입니까?

모든 브라우저에서 표 셀의 텍스트 줄 바꿈을 보장하는 방법은 무엇입니까?

Barbara Streisand
Barbara Streisand원래의
2024-11-09 11:29:02231검색

How to Ensure Text Wrapping in Table Cells Across All Browsers?

표 셀 내 텍스트 줄바꿈을 위한 CSS

표 셀 안의 텍스트 줄 바꿈이 필요한 경우 브라우저 호환성을 고려하는 것이 필수적입니다. . 단어 분리를 사용하는 동안: break-all; 테이블 레이아웃: 고정; Chrome에서는 충분할 수 있지만 Firefox에서는 예상대로 작동하지 않을 수 있습니다.

브라우저 간 호환성

이 브라우저 호환성 문제를 해결하려면 보다 포괄적인 CSS 솔루션을 사용할 수 있습니다. 채용됨:

.wrapword {
    white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
    white-space: -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+ */
    word-break: break-all;
    white-space: normal;
}

이 CSS를 사용하면 다양한 브라우저에서 텍스트가 적절하게 줄 바꿈됩니다. 표 셀에 랩워드 클래스를 적용하면 원치 않는 공백 없이 텍스트가 자동으로 끊어집니다.

<table>

이 기술을 사용하면 표 셀 내의 텍스트를 효과적으로 줄 바꿈하여 브라우저 간 호환성을 유지할 수 있습니다.

위 내용은 모든 브라우저에서 표 셀의 텍스트 줄 바꿈을 보장하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.