Hi FE !
Ai
git
前端面试题
前端小tip
  • vite
  • webpack
npm
  • vue2
  • vue3
react
GitHub
Ai
git
前端面试题
前端小tip
  • vite
  • webpack
npm
  • vue2
  • vue3
react
GitHub
  • text-wrap: balance:智能均衡文本折行

text-wrap: balance:智能均衡文本折行

介绍

text-wrap 是一个 CSS 属性,用于指定如何处理文本的换行。它有三个可能的值:normal、none 和 balance。

  • normal:这是默认值,表示文本将按照正常的换行规则进行换行。如果一行文本太长,无法在一行内显示,那么它将被分成多行,直到所有文本都被显示出来。
  • none:表示文本将不会换行,所有文本都将显示在一行内,直到遇到 <br> 标签为止。
  • balance:表示文本将根据需要自动换行,以保持文本的平衡。这意味着,如果一行文本太长,无法在一行内显示,那么它将被分成多行,直到所有文本都被显示出来。但是,与 normal 值不同的是,balance 值会尽量保持每行的长度大致相等,以保持文本的平衡。

示例

p {
  text-wrap: balance;
}
Edit this page
最近更新: 2025/12/2 01:46
Contributors: qdleader
qdleader
本站总访问量 129823次 | 本站访客数 12人