css控制文本内容显示省略号
1,单行文字显示省略号
div{
width:200px;
overflow:hideen;
white-space:nowrap;
text-overflow:ellipsis;
}
2,多行文字显示省略号
div{
width:200px;
overflow:hideen;
text-overflow:ellipsis;
display:-webkit-box;//将对象作为弹性伸缩盒子模型显示
-webkit-line-clamp:2;//控制显示几行文字
-webkit-box-orient:vertical;//设置伸缩盒对象的子元素排列方式
}
如果你标签内的是英文,英文是不会自动换行的,所以你需要让英文自动换行,添加一下代码
word-wrap:break-word;
word-break:break-all;
css控制文本内容显示省略号的更多相关文章
- CSS换行文本溢出显示省略号
现代浏览器中使用css可以实现文本溢出,使用 text-overflow: ellipsis;在有些场景下没有效果,这个时候你需要检查应用的场景是是否是块元素,是否有确切的width. 如果是行内元素 ...
- CSS单行文本溢出显示省略号
此为转载,原文地址 项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英 ...
- css文本内容显示省略号
文字显示省略号width: 4.5rem;overflow: hidden;white-space: nowrap;text-overflow: ellipsis; 但是这个属性只支持单行文本的溢出显 ...
- css实现文本溢出显示省略号
看到很多网站上的文章列表只显示一部分,之后就是一个阅读全文链接,或者是以一个省略号结尾.今天就说说单行文本,多行文本溢出时怎么显示省略号? 单行 overflow: hidden; white-spa ...
- CSS换行文本溢出显示省略号,多行
首先,div部分 <body> <div>多行的显示该如何解决呢,后面经过一番google后,我找到了chrome的一个API可以解决上面提到的需求-webkit-line-c ...
- CSS控制长文本内容显示(截取的地方用省略号代替)
自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,下面介绍的是CSS如何实现处理的方法. 现实中经常出现一些内容比较长的文本,为了使整体布局美观,需要将文本内容控制在一行 ...
- CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行
CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行. 一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加*/ ...
- CSS文本溢出显示省略号
项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英雄指教. 单行 语法 ...
- CSS和JS实现文本溢出显示省略号
本文记录实现文本溢出显示省略号的几种方式. 单行文本 三行CSS代码实现: overflow: hidden; // 文本溢出隐藏 text-overflow: ellipsis; // 显示省略号 ...
随机推荐
- C# walls
在学习C#的阶段中,我们一点一点的往前爬, 此代码需要添加selenium ,和 获取 引用. using Ivony.Html.Parser; using Ivony.Html; using Ope ...
- 关于viewpager的滑动问题
今天碰到很诡异的问题,viewpager中放置至少三张图片的时候能够正常实现循环滑动,只放置一张或者两张的时候就不行. 后来发现问题症结:viewpager需要保证既可以向左滑动,又可以向右滑动,因此 ...
- EM 算法资料
EM 算法的英文全称是: Expectation-Maximum. EM 算法的步骤 假设 \(Z\) 是隐变量,\(\theta\) 是待定参数. E 步:固定参数 \(\theta\),求 \(Z ...
- jQuery-validate插件初级篇
特别提示:本人博客部分有参考网络其他博客,但均是本人亲手编写过并验证通过.如发现博客有错误,请及时提出以免误导其他人,谢谢!欢迎转载,但记得标明文章出处:http://www.cnblogs.com/ ...
- C# Socket-TCP异步编程原理详解附源码
目录 目录异步原理主要方法源码Server源码:Client源码实验效果(广播为例)参考博客 TOC 异步原理 套接字编程原理:延续文件作用思想,打开-读写-关闭的模式. C/S编程模式如下: Ø 服 ...
- 在配置em时运到报错ORACLE_UNQNAME not defined
Oracle 11G R2 RAC 配置em时报错 Environment variable ORACLE_UNQNAME not defined. oracle ORACLE_UNQNAME 借楼主 ...
- P1309 瑞士轮 (吸氧了)
P1309 瑞士轮 题解 1.这题可以模拟一下 2.sort吸氧可以过(可能是排序有点慢吧,不开会T) sort排序时注意: return 1 是满足条件,不交换 return 0是不满足,交换 代码 ...
- 通过同步上下文方式更新winform中的控件信息
SynchronizationContext 类是一个基类,可提供不带同步的自由线程上下文. 此类实现的同步模型的目的是使公共语言运行库内部的异步/同步操作能够针对不同的异步模型采取正确的行为.此模型 ...
- c++实验10 图的应用实验
大体与上次实验相同,特点为图是邻接表存储结构 --博客后半部分有程序的所有代码-- 1.图邻接表存储结构表示及基本操作算法实现 所加载的库函数或常量定义及类的定义: #include "Se ...
- oracle存储过程和存储函数
存储过程 1.存储过程简介 下面先来简单介绍一下oracle的存储过程的语法,如下: create or replace procedure Tony_Process ( num in number, ...