css 换行

作者：风中孤狼发布日期:2025-10-30 浏览:66

/* 示例代码：使用 CSS 实现换行 */

/* 方法 1: 使用 white-space 属性 */
p {
  white-space: pre-line; /* 保留空白符序列，但是正常地进行换行处理 */
}

/* 方法 2: 使用 word-break 属性 */
div {
  word-break: break-all; /* 强制文本在任意字符处换行 */
}

/* 方法 3: 使用 br 标签（HTML） */
p {
  /* 在需要换行的地方插入 <br> 标签 */
}

/* 方法 4: 使用 flex-wrap 属性（适用于 Flexbox 布局） */
.container {
  display: flex;
  flex-wrap: wrap; /* 允许子元素换行 */
}

解释说明：

white-space: pre-line：允许文本中的空格和换行符被保留，但会在必要时自动换行。
word-break: break-all：强制文本在任何字符处换行，通常用于避免长单词溢出容器。
标签：这是 HTML 中的换行标签，可以在需要的地方手动插入换行。
flex-wrap: wrap：当使用 Flexbox 布局时，可以让子元素在容器宽度不足时自动换行。

上一篇：css absolute 居中

下一篇：css字间距怎么设置