saber酱的抱枕

Fly me to the moon

09/4
11:55
学习

css控制文字超出显示为省略号

以下css代码可以控制文字超出显示区域时裁剪为省略号:

{white-space:nowrap;  text-overflow:ellipsis;overflow: hidden;vertical-align:top;}

前三个属性缺一不可。

需要注意的是,chrome中加上overflow:hidden之后可能会导致右侧的元素上下错位,加上vertical-align属性可以解决。

css控制文字超出显示为省略号