css文字超长显示...

作者：冰残°零度伤发布日期:2025-09-22 浏览:68

/* 当文字超长时，使用省略号显示 */
.text-ellipsis {
  white-space: nowrap; /* 防止文字换行 */
  overflow: hidden; /* 超出部分隐藏 */
  text-overflow: ellipsis; /* 超出部分用省略号表示 */
  max-width: 200px; /* 设置最大宽度，可以根据需要调整 */
}

解释说明：

white-space: nowrap;：防止文本换行，确保文本在一行内显示。
overflow: hidden;：当文本超出容器的宽度时，隐藏超出的部分。
text-overflow: ellipsis;：当文本溢出时，用省略号（...）代替超出的部分。
max-width: 200px;：设置文本容器的最大宽度，超出此宽度的文本将被截断并显示省略号。你可以根据实际需求调整这个值。

上一篇：css label

下一篇：css flex换行