超出文本省略号显示(单行/多行)
程序员文章站
2022-03-02 15:22:31
...
一:使用CSS属性
单行:
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
多行:
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;/*控制行数*/
-webkit-box-orient: vertical;
二:用jq方法
多行:
$(function() {
$("p").each(function() {
var maxwidth = 200;
if ($(this).text().length > maxwidth) {
$(this).text($(this).text().substring(0, maxwidth));
$(this).html($(this).html() + '...');
}
});
})
上一篇: CSS超出文本省略号