设置text-overflow: ellipsis;为什么文字还是超过了p标签？

Question

很奇怪，不知是为什么？

Answer 1

text-overflow 只是用来说明文字溢出时用什么方式显示，要实现溢出时产生省略号的效果，还须定义文本在一行内显示（white-space:nowrap）及溢出内容为隐藏（overflow:hidden），只有这样才能实现溢出文本显示省略号的效果

Answer 2

overflow: hidden;

Answer 3

查看下这个p元素的宽度，可能是因为没有对它设置宽度，它继承了某个祖先元素的宽度，以至没有达到预期效果

Answer 4

text-overflow要配合white-space,width,overflow三个属性一起使用才有效果