单行文本溢出省略和多行文本溢出省略

时光无声￡

于 2023-02-01 16:59:17 发布

阅读量151

点赞数

分类专栏： CSS 文章标签： css

本文链接：https://blog.csdn.net/weixin_44586981/article/details/128836971

版权

CSS 专栏收录该内容

22 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        *{
            margin: 0;
            padding: 0;
        }
        .pa{
            /*单行文本省略*/
            /*width: 200px;*/
            /*display: block;*/
            /*white-space: nowrap;*/
            /*overflow: hidden;*/
            /*text-overflow: ellipsis;*/
        /*    多行文本省略*/
            width: 200px;
            display: -webkit-box;
            overflow: hidden;
            text-overflow: ellipsis;
            -webkit-box-orient: vertical;
            -webkit-line-clamp:2
        }
    </style>
</head>
<body>
<span class="pa">
    测试服方钢管测试服方钢管测试服方钢管测试服方钢管测试服方钢管测试服方钢管sdfsaggsag
</span>
</body>
</html>