以前实现这种效果需要在程序里判断字符的长度,如果长度大于多少个字符,就截取字符,用省略号代替,而且是在服务器处理的,现在只需要用css的属性来操作,简单、实用、节省性能、不用做过多的程序判断、节约开发时间，可谓一举多得。在此分享一下，欢迎交流
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>text-overflow</title>
<style type="text/css">
.test_demo{
text-overflow:ellipsis;
overflow:hidden;
white-space:nowrap;
width:100px;
background:#0094ff;
color:#FFF;
padding:10px;
margin:10px;
border-radius:5px;
}
.test_demo:hover{
text-overflow:ellipsis;
overflow:hidden;
white-space:nowrap;
width:100px;
background:#337ab7;
color:#FFF;
padding:10px;
margin:10px;
border-radius:5px;
}
</style>
</head>
<body>
<div class="test_demo">超酷的IT技术学习平台（我是省略号）</div>
</body>
</html>