css文本截字,超出文本省略号显示
一、单行文本截字
p {
text-overflow: ellipsis;/*显示省略号代替裁剪的文本*/
white-space: nowrap;/*空白处理方式 不换行*/
overflow: hidden;/*溢出隐藏*/
}
效果:

二、多行文本截字
p{
display:-webkit-box;/*设置盒子为弹性盒容器*/
-webkit-box-orient:vertical;/*设置盒子内部排列方式为垂直排列*/
-webkit-line-clamp:;/*显示两行*/
text-overflow:ellipsis;/*用省略号代替才建的文字*/
overflow:hidden;/*溢出隐藏*/
/*若为纯字母、数字,需要加上下面这句*/
word-break:break-all;
}
效果

css文本截字,超出文本省略号显示的更多相关文章
- android开发之当设置textview多少字后以省略号显示。限制TextView的字数
设置多少字后以省略号显示 <TextView android:id="@+id/tv" android:layout_width="wrap_conten ...
- css实现文本超出部分省略号显示
一般超出文本显示分为两种:单行超出文本和多行超出文本省略号显示,实现方式使用纯css实现: div { // 单行 white-space: nowrap; overflow: hidden; tex ...
- 翻译:如何使用CSS实现多行文本的省略号显示
本文翻译自CSS Ellipsis: How to Manage Multi-Line Ellipsis in Pure CSS,文中某些部分有些许改动,并添加译者的一些感想,请各位读者谅解. 合理的 ...
- CSS文本单行或者多行超出区域省略号(...)显示方法
单行超出时,主要用到几个CSS属性: 1.text-overflow : clip | ellipsis ; clip : 不显示省略标记(...),而是简单的裁切ellipsis : 当对象内文本溢 ...
- 文本太长,用省略号显示的css样式
——html代码 <divid="d1" title="鼠标放上显示的文字"></div> ——css代码 #d1{ width:300 ...
- CSS div内文字显示两行,超出部分省略号显示
1. 概述 1.1 说明 在项目过程中,有时候需要控制div内文字最多显示两行,超出的使用省略号进行处理.使用识别码/前缀-webkit进行处理可直接得到相应效果. 1.1 -webkit WebKi ...
- css 文字展示两行 其余的省略号显示
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- HTML5--div、span超出部分省略号显示
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 微信小程序 实现多行文字 超出部分省略号显示
在开发小程序: 澳买 的 时候 遇到一个棘手的问题: 当搜索澳洲产品,获取产品列表的时候,有时候产品的名称翻译成中文特别长 我们不能全部在有限的列表里面把产品名都显示出来,这样格式不好控制,显示 出来 ...
随机推荐
- 【NLP_Stanford课堂】正则表达式
或者 [Ww]oods,方括号里的是或的关系,符合其一即被提出.用来匹配单个字符 [A-Z]:表示所有的大写字母之一 [a-z]:表示所有的小写字母之一 [0-9]:表示所有的0-9的数字之一 否定: ...
- windows网络命令汇总
分类: 网络技术2011-10-26 09:43 2557人阅读 评论(0) 收藏 举报 windows网络路由器dns服务器internetinterface Ping命令: ping命令通过发送I ...
- 关于main函数的参数,argc,argv的内部机制
偶尔对main函数的参数感兴趣,写了个程序验证. int main(int argc,char **argv) 首先,解释两点: 第一 .系统将参数列表,即我们在shell下输入的命令,存储到一个一维 ...
- spring boot拦截器配置
1.在spring boot配置文件application.properties中添加要拦截的链接 com.url.interceptor=/user/test 2.编写拦截器代码 ,创建UrlInt ...
- Facet constraits error: Spring 4.1 requires Java 1.6 or newer.
问题来源: 在高版本的myeclipse,同步低版本的myeclipse提交的项目,可能会出现配置不一致. 问题描述: spring4.1不支持jdk1.6 注:在下载项目到本地的时候,myeclip ...
- jQuery插件编写步骤详解
如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jquery 及ui 内置web项目里了.至于使用jquery好处这里就不再赘述了,用过的都知道.今天我们来讨论下jq ...
- 第一次使用Git
这次的作业是关于GIT的,一开始我并不知道GIT是啥,百度了一下才知道Git是一个开源的分布式版本控制系统,可以有效.高速的处理从很小到非常大的项目版本管理. Git 是 Linus Torvalds ...
- SQL的id奇迹
SELECT id,name FROM test where name is null and id>=26 limit 26,3 这里26和26没关系,不是id额
- Android(java)学习笔记4:线程的控制
1. 线程休眠: Java中线程休眠指让正在运行的线程暂停执行一段时间,进入阻塞状态,通过调用Thread类的静态方法sleep得以实现. 当线程调用sleep进入阻塞状态后,在其休眠的时间内,该线程 ...
- Release模式下无法调试打印对象的解决方式
之前碰到在release模式下无法打印对象的问题,只能切换到debug模式下调试, xcode release 模式下, 会关掉断点读取变量的上下文环境,以提高运行速度, ⚠️ 记得调试完再改回去,防 ...