一、添加-文字显示超出范围时隐藏属性

overflow:hidden;

二、添加-超出文字省略号属性

text-overflow:ellipsis;

三、添加-文字不换行属性

white-space:nowrap;

CSS - 实现文字显示过长时用省略的更多相关文章

  1. CSS控制文字显示一行，超出显示省略号

    这几天在项目需求里面遇到了很多之前没做过的需求,也慢慢更加认识到了css的强大,是真的强大.以后会把自己技术调研的东西都写出来,哪怕只是一点点或者很小的点,重在学习. “CSS控制文字显示一行,超出显 ...

  2. css限制文字显示字数长度，超出部分自动用省略号显示,防止溢出到第二行

    为了保证页面的整洁美观,在很多的时候,我们常需要隐藏超出长度的文字.这在列表条目,题目,名称等地方常用到. 效果如下: 未限制显示长度,如果超出了会溢出到第二行里.严重影响用户体验和显示效果. 我们在 ...

  3. css控制文字显示长度，超过用省略号替代

    .line_text { width:200px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } <span cl ...

  4. ant design table td 文字显示过长添加省略号、ant 文字过长时添加tootip提示

    方法1: overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit ...

  5. css：文章标题过长时，使用省略号

    html代码 <ul> <li><a href="" target="_blank">我是文章1,现在标题过长,使用css加 ...

  6. css让文字显示特定行数，多余的显示省略号

    /*css*/ .p{ width: 200px; word-break: break-all; text-overflow: ellipsis; display: -webkit-box; /** ...

  7. 使用css控制文字显示几行并且剩余部分隐藏（移动端和PC端同样适用）

    前言 有些需求需要我们控制一段文本最多显示几行,就像逛淘宝京东的评价楼层一样,有时可能还需要隐藏剩余部分,这样的需求我们怎么来解决呢? 解决办法 我们完全可以使用css来解决这一需求 1. 解决文本显 ...

  8. css 控制文字显示两行,多余用省略号 手机端

    p { width:100px; position:relative; line-height:20px; /*行高为高度的一半,这样就是两行*/ height:40px; overflow:hidd ...

  9. 关于echarts中的饼状图的label文字显示过长的问题

    label: { normal: { fontSize: 14, formatter(v) { let text = v.name let count = text.indexOf('￥') cons ...

随机推荐

  1. c++中智能输出文件

    首先我们要为每一时间步,设置一个文件名: ] = "; itoa(time,timestr,); std::string s; s += timestr; std::string path ...

  2. Android Studio @Bind的用法，自动生成findViewById无需再实例化控件

    第一步:app 的build.gradle文件中添加 如下代码: compile 'com.jakewharton:butterknife:7.0.0' 点击Sync Now 同步下载第二步:安装插件 ...

  3. li下用了浮动IE6的问题

    li下用了浮动IE6的问题 直接看HTML <ul> <li><a href="#" target="_blank">沃尔沃 ...

  4. discuz问题综合

    1.discuz x2搬家问题:搬家后,需要修改数据库的配置文件,包含:      主要的配置文件有三个:config目录下的config_global.php和config_ucenter.php以 ...

  5. 资源下载南方cass视频教程,包括文档,数据,很全的

    废话就不多说了,开始... 北方cass视频教程,包括文档,数据,很全的 视频下载地址:http://www.400gb.com/file/23459263 GIS网盘进入下载:http://laoh ...

  6. 使用 DLL 的优点

    动态链接具有下列优点: 节省内存和减少交换操作.很多进程可以同时使用一个 DLL,在内存中共享该 DLL 的一个副本.相反,对于每个用静态链接库生成的应用程序,Windows 必须在内存中加载库代码的 ...

  7. Swift编程语言学习4.3—— 控制语句

    控制传递语句(Control Transfer Statements) 控制转移语句改变你代码的运行顺序,通过它你能够实现代码的跳转.Swift有四种控制转移语句. continue break fa ...

  8. Android闹钟【复杂版】

    最近做闹钟,所以自己写了个Demo版本,这个程序是用listview单独的类来实现的,和activity类分开来实现的!这个是用数据库进行更新的,当闹钟设置后,闹钟图片变成闹钟的样子,闹钟取消后,图片 ...

  9. hung_task_timeout_secs 和 blocked for more than 120 seconds

    https://help.aliyun.com/knowledge_detail/41544.html 问题现象 云服务器 ECS Linux 系统出现系统没有响应. 在/var/log/messag ...

  10. C#中listbox中选中多项，并删除

    1.SelectionMode 改成可以多选2.利用KeyDown事件: private void listBox1_KeyDown(object sender, KeyEventArgs e) { ...