美文网首页
中间点和省略

中间点和省略

作者: 陌紫嫣 | 来源:发表于2018-08-20 10:20 被阅读0次

    1.中间点(会自动根据左右变化大小颜色)
    &middot

    2.超出省略(只适合内核为webkit的浏览器)

       overflow:hidden;
        text-overflow:ellipsis;//超出用省略号代替
        display:-webkit-box;
        -webkit-box-orient:vertical;
        -webkit-line-clamp:1;//行数
        height: 1.25rem;//必须给固定高
    

    3.如果要适应其他内核,比如火狐的话,可以考虑限制字数

     $(function () {
                $(document).ready(function () {
                    //限制字符个数
                    $('.dot').each(function () {
                        var maxwidth = 98;
                        if ($(this).text().length > maxwidth) {
                            $(this).text($(this).text().substring(0, maxwidth));
                            $(this).html($(this).html() + '…');
                        }
                    });
                })
            })
    

    相关文章

      网友评论

          本文标题:中间点和省略

          本文链接:https://www.haomeiwen.com/subject/fnbxbftx.html