admin 发表于 2024-5-25 18:20:19

限制一行和多行文字数量,超出部分用省略号显示

1. 设置一行文字显示文本数量,超出部分用…表示
知识点:css3 text-overflow属性
属性值      描述
clip      修剪文本。
ellipsis      显示省略符号来代表被修剪的文本。
string      使用给定的字符串来代表被修剪的文本。
代码实现(单行)超出部分省略:

#div1{
   overflow: hidden;   
         text-overflow: ellipsis;      //超出部分以省略号显示
         white-space: nowrap;
         width: 20em;//用px单位亦可行
}
<div id="div1">
今天学习任务是总结
1、快排代码及思想,2、css实现三角形圆形,3、js和css实现限制显示字数,文字长度超出部分用省略号表示 只显示一行。4、还有js基础视频学习。5、三次握手
</div>效果图:


页: [1]
查看完整版本: 限制一行和多行文字数量,超出部分用省略号显示