CSS는 텍스트의 지정된 너비를 초과하고 대신 타원을 사용하며 텍스트가 줄 바꿈되지 않습니다.

이 글에서는 주로 소개 타원을 사용하여 텍스트의 지정된 너비를 넘어서 CSS를 대체하고 텍스트를 줄바꿈하지 않는 방법이 매우 실용적이라고 생각하여 스크립트에서 공유합니다. 참고용 홈 플랫폼

일반 텍스트 잘림(인라인 및 블록에 적용):

.text-overflow {   
    display:block;/*内联对象需加 */
    width:31em;/* 何问起 hovertree.com */
    word-break:keep-all;/* 不换行 */
    whitewhite-space:nowrap;/* 不换行 */
    overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
    text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/
}

테이블 텍스트 오버플로 정의:

테이블이 범위를 벗어난 경우 줄임표 표시

table{   
     width:em;   
     table-layout:fixed;/* 只有定义了表格的布局算法为fixed，下面td的定义才能起作用。 */
 }   
 td{   
    width:%;   
    word-break:keep-all;/* 不换行 */
    whitewhite-space:nowrap;/* 不换行 */
    overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
    text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/
}

이 CSS 스타일은 한 줄의 텍스트에서만 작동한다는 점입니다. 여러 줄에 사용하려는 경우 첫 번째 줄만 작동합니다.

IE에서만 이런 식으로 "..."가 표시됩니다. 다른 브라우저에서는 텍스트가 지정된 너비를 초과하면 이를 숨깁니다.

위 내용은 CSS가 텍스트의 지정된 너비를 초과하고 텍스트가 줄바꿈되지 않는 경우 생략 부호를 사용하는 방법에 대한 소개입니다. 또한 여러분의 지원에 진심으로 감사드립니다. PHP 중국어 웹사이트!

위 내용은 CSS는 텍스트의 지정된 너비를 초과하고 대신 타원을 사용하며 텍스트가 줄 바꿈되지 않습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!