描述:在制作卡片过程中,title,description 有可能会超出边界,所以需要将超出边界部分做省略处理,这样可以维持设计的美观.

# 代码演示

标题:文本超出边界处理 作者:lzx 介绍:lzx的博客,lzx的博客,lzx的博客,lzx的博客,lzx的博客,lzx的博客,lzx的博客,lzx的博客,lzx的博客,lzx的博客,

# 核心代码

<span class="clamp">介绍:lzx的博客,lzx的博客,lzx的博客,lzx的博客,lzx的博客,lzx的博客,lzx的博客,lzx的博客,lzx的博客,lzx的博客,</span>

<style>
    .clamp{
        overflow: hidden;
        -webkit-line-clamp: 2;//设置行数;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
    }
</style>