css文本超出显示省略号

1.一行超出显示省略号

.wrap{
    -o-text-overflow: ellipsis;
    text-overflow:ellipsis;
    overflow:hidden;
    white-space:nowrap;  /*规定段落中的文本不进行换行 */
    border: 1px solid black;
    width: 400px;
    height: 20px;
    padding: 20px;
}

 

2.多行超出显示省略号

.test1{
    width: 400px;
    height: 54px;
    border: 1px solid #666;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3; /* 设置几行开始出现省略号 */
    overflow: hidden;
}