文字超出用省略号代替

        <!DOCTYPE html>
    <html>
    <head>
        <meta http-equiv="Content-type" content="text/html;charset=utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
        <title>文字超出用省略号代替</title>
        <style>
        .text-deal{
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            height: auto;
            line-height: 24px;
            padding: 0 15px;
            padding-top: 10px;
            white-space: normal;
        }
        </style>
    </head>
    <body>
    <div class="text-deal">
        这是一个有效果的文字超出用省略号代替的例子,你看可以吗?这是一个有效果的文字超出用省略号代替的例子,你看可以吗?这是一个有效果的文字超出用省略号代替的例子,你看可以吗?
    </div>
    </body>
    </html>

原文地址:https://www.cnblogs.com/water-wf/p/8707540.html