多行文字省略号和单行文字shenglueh

1.单行文字省略号

html:

<view class="overflow-hiden">
            哈哈哈哈哈哈哈哈哈哈哈哈或哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈或或或或或或或或或
 </view>

CSS:

    .overflow-hiden{
        width:500upx;
        margin:80upx auto;
        background-color:#D4EAFD;
        height:150upx;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

2.多行文字省略号

html:

<view class="overflow-hiden">
            哈哈哈哈哈哈哈哈哈哈哈哈或哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈或或或或或或或或或
 </view>

css:

    .overflow-hiden{
        width:500upx;
        margin:80upx auto;
        background-color:#D4EAFD;
        height:150upx;

//以下为重点
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient:vertical;
        -webkit-line-clamp:3;//此行代码代表3行文字后省略号        
    }