Skip to content

文本溢出

定义

文字溢出包括两种方式,分布为省略和裁剪,在 ZUI 中可以通过如下工具类实现:

工具类属性
text-ellipsisoverflow: hidden; text-overflow: ellipsis; white-space: nowrap;
text-clipoverflow: hidden; text-overflow: clip; white-space: nowrap;

文字省略 text-ellipsis

使用 text-ellipsis 用省略号(…)来截断溢出的文本。

The quick brown fox jumps over the lazy dog.白日依山尽,黄河入海流。欲穷千里目,更上一层楼。The quick brown fox jumps over the lazy dog.白日依山尽,黄河入海流。欲穷千里目,更上一层楼。

文字裁剪 text-clip

使用 text-clip 在内容区域的极限处截断文本。

The quick brown fox jumps over the lazy dog.白日依山尽,黄河入海流。欲穷千里目,更上一层楼。The quick brown fox jumps over the lazy dog.白日依山尽,黄河入海流。欲穷千里目,更上一层楼。

MIT License (MIT)