请选择 进入手机版 | 继续访问电脑版

数字之家

 找回密码
 立即注册

扫一扫,访问微社区

QQ登录

只需一步,快速开始

搜索
热搜: 活动 交友 discuz
查看: 4154|回复: 0

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

[复制链接]

514

主题

519

帖子

2426

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
2426
admin实名认证 发表于 2019-8-31 18:36:43 | 显示全部楼层 |阅读模式
1. 设置一行文字显示文本数量,超出部分用…表示
知识点:css3 text-overflow属性
属性值        描述
clip        修剪文本。
ellipsis        显示省略符号来代表被修剪的文本。
string        使用给定的字符串来代表被修剪的文本。
代码实现(单行)超出部分省略:
原文地址https://blog.csdn.net/qq_40072782/article/details/82908581
  1. #div1{
  2.    overflow: hidden;   
  3.          text-overflow: ellipsis;      //超出部分以省略号显示
  4.          white-space: nowrap;
  5.          width: 20em;  //用px单位亦可行
  6. }
  7. <div id="div1">
  8. 今天学习任务是总结
  9. 1、快排代码及思想,2、css实现三角形圆形,3、js和css实现限制显示字数,文字长度超出部分用省略号表示 只显示一行。4、还有js基础视频学习。5、三次握手
  10. </div>
复制代码

效果图:
20180930152153710.png
maomivip@mail.com
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|赢创志诚服务网 ( 鲁ICP备19000917号 )

GMT+8, 2020-9-28 03:50 , Processed in 0.100427 second(s), 32 queries .

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表