怎么实现CSS限制字数,超出部份显示点点点
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了怎么实现CSS限制字数,超出部份显示点点点相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html><html>
<head>
<style>
div.test
white-space:nowrap;
width:12em;
overflow:hidden;
border:1px solid #000000;
</style>
</head>
<body>
<p>下面两个 div 包含无法在框中容纳的长文本。正如您所见,文本被修剪了。</p>
<p>这个 div 使用 "text-overflow:ellipsis" :</p>
<div class="test" style="text-overflow:ellipsis;">This is some long text that will not fit in the box</div>
<p>这个 div 使用 "text-overflow:clip":</p>
<div class="test" style="text-overflow:clip;">This is some long text that will not fit in the box</div>
</body>
</html> 参考技术A text-overflow:ellipsis;
jquery字数限制超出显示...,原有内容在title中显示
为标签添加class = sliceFont;添加data-num属性为要显示的字数,截取后会在title中显示原有字符串;
$(‘.sliceFont‘).each(function(index, el) { var num = $(this).attr(‘data-num‘); var text = $(this).text(); var len = text.length; $(this).attr(‘title‘,$(this).text()); if(len > num){ $(this).html(text.substring(0,num) + ‘...‘); } });
以上是关于怎么实现CSS限制字数,超出部份显示点点点的主要内容,如果未能解决你的问题,请参考以下文章