CSS überschreitet die angegebene Textbreite und verwendet stattdessen Ellipsen und der Text wird nicht umbrochen.

Dieser Artikel stellt hauptsächlich die relevanten Informationen zur Verwendung von Ellipsen vor, um CSS über die angegebene Textbreite hinaus zu ersetzen und den Text nicht umzubrechen, und ich teile sie hiermit im Skript Home-Plattform als Referenz.

Allgemeine Textkürzung (gilt für Inline und Block):

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

Für Tabelle Textüberlauf Definition:

Für Tabelle außerhalb des zulässigen Bereichs Anzeigeauslassungspunkte

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

Was Sie beachten müssen, ist, dass dieser CSS-Stil nur für eine einzelne Textzeile funktioniert. Wenn Sie ihn für mehrere Zeilen verwenden möchten, nur für die erste Zeile wird funktionieren.

Andere Browser blenden den Text aus, wenn er die angegebene Breite überschreitet.

Das obige ist der detaillierte Inhalt vonCSS überschreitet die angegebene Textbreite und verwendet stattdessen Ellipsen und der Text wird nicht umbrochen.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!