css控制文本单行或者多行溢出显示为省略号...

Posted on 2017-08-14 23:35  快乐的~小和尚  阅读(251)  评论(0)    收藏  举报

p:first-child {
　　background-color: pink;
　　width: 150px;
　　line-height: 28px;
　　font-size: 20px;
　　overflow: hidden;
　　text-overflow: ellipsis;
　　white-space: nowrap;
}

p:last-child {
　　background-color: pink;
　　width: 150px;
　　line-height: 28px;
　　font-size: 20px;
　　overflow: hidden;
　　text-overflow: ellipsis;
　　display: -webkit-box;
　　-webkit-box-orient: vertical;
　　-webkit-line-clamp:3;
　　 //这里其实是让第三行末尾显示为省略号罢了,如果去掉overflow: hidden;
}