CSS 单行、多行文本溢出显示省略号

<---记录贴--->

HTML部分

<div class="overhidden">Lorem ipsum dolor sit amet consectetur adipisicing elit. Alias odit quos aut itaque nulla explicabo vitae voluptate dolor autem quaerat magni animi veritatis facilis, facere esse consequuntur porro ullam omnis.</div>

 

CSS部分

 

单行文本

.overhidden{

        overflow: hidden;

        white-space: nowrap;

        text-overflow: ellipsis;

    }

效果如图：

 

 多行文本

.overhidden {

        display: -webkit-box;

        -webkit-box-orient: vertical;

        -webkit-line-clamp: 3;

        overflow: hidden;

    }

效果如图：