文本溢出处理是前端开发者必备的一个技能，很多时候，你无法预料到文本到底有多长，用手动的方式删除文本肯定是不现实，就需要自动的让多出的文字变省略号，所以掌握text-overflow很有必要。

语法

text-overflow:ellipsis;

ellipsis：当对象内文本溢出时显示省略标记（…）

单独使用text-overflow属性是无法得到想要的效果。因为text-overflow属性只是说明文字溢出时用什么方式显示，要实现溢出时产生省略号效果，还比须多定义2个标签

white-space:nowrap;（强制文本在一行内显示）

overflow:hidden;（溢出内容为隐藏）

还有一个隐形的条件，宽度width要设定，否者也无法实现效果。

这是一个处理文本溢出的css公式。只要上面的条件达成了，就可以实现文本溢出的部分用省略号表示。

案例

要实现也并不难，就是个公式，把3个属性带上，在设定一个宽度，就再也不怕文字溢出。

以下就是文字溢出

总结