1. 只显示单行文本，多余文本使用...代替

   white-space: nowrap;

   overflow: hidden;

   text-overflow: ellipsis;

2. 显示多行文本，多余文本使用...代替

   display: -webkit-box;

   overflow: hidden;

   -webkit-box-orient: vertical;

   -webkit-line-clamp: 2;/*控制可显示几行文本*/

　　

css多余文本使用....代替的更多相关文章

  1. CSS多余文本省略号显示

    CSS多余文本省略号显示 本次案例代码是在 elementui 当中的 table 组件中实际需求 当然使用的是纯 CSS3 代码,所以原生支持度高,兼容性高,所以可多场景应用 对于过长文本进行单行省 ...

  2. td之overflow:hidden 多余文本隐藏效果

    td之overflow:hidden 多余文本隐藏效果 方法1: table-layout: fixed; width: 200px; 语法: table-layout : auto | fixed ...

  3. 如何设置文本不换行省略号显示等CSS常用文本属性

    如何让多余的文本省略号显示首先要说几个属性的作用: whitespace:nowrap 中文行末不断行显示 overflow: 控制超出文本的显示方式:hidden 超出范围文本隐藏:scroll 始 ...

  4. css常用文本属性

    [CSS常用文本属性] 1. 字体.字号类: ① font-weight: 字体粗细. bold-加粗.normal-正常.lighter-细体 也可以使用100-900数值,400表示normal, ...

  5. CSS基本属性—文本属性和背景属性

    一.CSS常用文本属性 [css中的颜色表示方式]   1.直接使用颜色的单词表示:red.green.blue    2.使用颜色的十六进制表示:#ff0000,#00ff00:    六位数,两两 ...

  6. CSS换行文本溢出显示省略号

    现代浏览器中使用css可以实现文本溢出,使用 text-overflow: ellipsis;在有些场景下没有效果,这个时候你需要检查应用的场景是是否是块元素,是否有确切的width. 如果是行内元素 ...

  7. 推荐20款基于 jQuery & CSS 的文本效果插件

    jQuery 和 CSS 可以说是设计和开发行业的一次革命.这一切如此简单,快捷的一站式服务.jQuery 允许你在你的网页中添加一些真正令人惊叹的东西而不用付出很大的努力,要感谢那些优秀的 jQue ...

  8. css构造文本

    1. 1. 文本缩进text-indent:值:值为数字,最常用的数值单位是px(像素),也可以直接是百分比!text-indent:100px;text-indent:10%;2. 文本对齐text ...

  9. CSS控制文本超出指定宽度后用省略号代替，CSS控制文本不换行

    CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行. 一般的文字截断(适用于内联与块): .text-overflow {     display:block;/*内联对象需加*/     ...

随机推荐

  1. Visual Studio2019及.NET CORE3.0的安装教程

    看到很多开发.net core的初学者在安装的时候就陷入问题了,不知道安装那些东西,好吧,既然要分享知识那么就尽量做得精细一点吧,我决定从零开始为大家讲解.net core,同时有.net core工 ...

  2. ORA-19625: error identifying file

    问题描述:rman进行备份的时候,出现报错ORA-19625,无效的文件 1.进行数据库备份,然后就出现了报错,没有这个24号的归档日志 RMAN> run{ 2> allocate ch ...

  3. 由malloc和new引发的段错误

    class Queue{ private: struct node{ string data; struct node * next,*priv; } private: struct node * p ...

  4. python子类如何继承父类的实例变量？

    类型1:父类和子类的实例变量均不需要传递 class A(object): def __init__(self): self.name = "cui" def get_name(s ...

  5. bsoj5988 [Achen模拟赛]期望 题解

    bsoj5988 Description [题目背景] NOI2018 已经过去了许久,2019 届的 BSOIer 们退役的退役,颓废的颓废,计数能力大不如前.曾经的数数之王 xxyj 坦言:&qu ...

  6. 深入理解 Spring Cloud 核心组件与底层原理

    一.Spring Cloud核心组件:Eureka Netflix Eureka Eureka详解 1.服务提供者 2.服务消费者 3.服务注册中心 二.Spring Cloud核心组件:Ribbon ...

  7. 如何判断IE OCX插件正常安装？

    项目中用到了一个第三方的ie ocx控件,而经常遇到客户和测试小伙伴反馈相关功能无法正常使用,也没有友好提示.考虑到这个问题,必须要有一个ie ocx控件的检查机制. 检查原理 创建ActiveXOb ...

  8. (转)两种高效过滤敏感词算法--DFA算法和AC自动机算法

    原文:https://blog.csdn.net/u013421629/article/details/83178970 一道bat面试题:快速替换10亿条标题中的5万个敏感词,有哪些解决思路? 有十 ...

  9. Highlight List View Objects 突出显示列表视图对象

    In this lesson, you will learn how to format data that satisfies the specified criteria. For this pu ...

  10. ES6-WeakSet数组结构

    WeakSet 也会去重 总结: 1.成员都是对象: 2.成员都是弱引用,可以被垃圾回收机制回收,可以用来保存 DOM 节点,不容易造成内存泄漏: 3.不能遍历,方法有 add.delete.has. ...