摘要：
话不多说，只要看看代码：内容超过显示省略号limitWord｛width:200px；溢出：隐藏；文本溢出：省略号；空白：nowrap；分词：保留所有；｝这是内容1，这是内容2，这是属性3，这是目录4，这是索引5，这是列表6，这是文件夹7运行效果如下：补充：我尝试使用span并添加相同的样式，但span没有实现省略号功能。只有p标记才能实现span函数。如果p标记想要实现span函数，只需要添加另一种样式：display:inline块；
不多说，直接看代码吧：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>内容超出显示省略号</title> <style> .limitWord{ width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break:keep-all; } </style> </head> <body> <p class="limitWord"> 这是内容1这是内容2这是内容3这是内容4这是内容5这是内容6这是内容7 </p> </body> </html>
运行效果如下：
补充：
我试过使用span，加入相同的样式，但是span并没有实现省略号功能，只有p标签可以实现，如果p标签要实现span的功能，只需要再加上一个样式即可：display:inline-block;