css文字超出换行

/* 设置容器的宽度，并使用 word-wrap 或 word-break 属性来处理超出的文字 */
.container {
  width: 200px;
  word-wrap: break-word; /* 当英文单词过长时，允许在任意字符处换行 */
  /* 或者使用以下属性 */
  /* word-break: break-all; */ /* 强制文本在任何字符处换行 */
}

/* 如果你希望文字超出容器时隐藏或显示省略号 */
.ellipsis {
  width: 200px;
  white-space: nowrap; /* 防止文字换行 */
  overflow: hidden; /* 超出部分隐藏 */
  text-overflow: ellipsis; /* 显示省略号 */
}

解释说明：

1. word-wrap: break-word;：当一个单词太长而无法在一行内显示时，它会在任意字符处断开并换行。适用于英文单词或长链接等。

2. word-break: break-all;：强制文本在任何字符处换行，适用于中文或其他不需要考虑单词边界的情况。

3. white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis;：当文本超出容器宽度时，隐藏超出部分并在末尾显示省略号（...），通常用于标题或简短描述。

如果你需要进一步调整，请根据具体需求选择合适的属性组合。