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

数字之家

 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,访问微社区

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

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

[复制链接]
  • TA的每日心情
    开心
    2019-5-30 08:42
  • 签到天数: 10 天

    [LV.3]偶尔看看II

    506

    主题

    511

    帖子

    2358

    积分

    管理员

    Rank: 9Rank: 9Rank: 9

    积分
    2358
    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, 2019-9-22 03:27 , Processed in 0.051554 second(s), 24 queries .

    Powered by Discuz! X3.4

    © 2001-2017 Comsenz Inc.

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