此处我们只做宽度固定的情况，文字超出后省略号只需要四个属性即可解决。废话不说直接上代码。
<!DOCTYPE html>
<html>
<head>
<meta charset=”utf-8″>
<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>
<title>css限制字数方法后加省略号</title>
<style>
.limit{
width:400px;
overflow:hidden; /*超出部分隐藏*/
white-space:nowrap; /*让文本强制在一行不换行*/
text-overflow:ellipsis;/*显示省略号来代表被修剪的文本*/
}
/*上面四个属性缺一不可*/
</style>
</head>
<body>
<div class=”limit” title=””>天生我才必有用天生我才必有用天生我才必有用天生我才必有用</div>
<!– css限制字数宽度必须有否则实现不了 –>
</body>
</html>
添加四个属性即可实现超出文字省略的效果。
版权声明：本文为yaofuheng原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。