css多行文本溢出显示省略号(…)
text-overflow:ellipsis
属性可以实现单行文本的溢出显示省略号(…)。但部分浏览器还需要加宽度width
属性。
css代码:
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
但是这个属性并不支持多行文本溢出显示省略号,这里根据应用场景介绍几个方法来实现这样的效果。
WebKit浏览器或移动端的页面
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
css多行文本溢出显示省略号(…)的更多相关文章
- css多行文本溢出显示省略号
HTML: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <met ...
- css多行文本溢出显示省略号(兼容ie)
在日常编写页面中,我们经常遇到内容行数过多时,需要出现 “...” 来处理.但是又要考虑IE浏览器或IE内核浏览器的兼容性. 普通实现方法: display: -webkit-box; -webkit ...
- CSS实现单行、多行文本溢出显示省略号(…)
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
- CSS和JS实现单行、多行文本溢出显示省略号(该js方法有问题不对)
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
- 布局常见问题之css实现多行文本溢出显示省略号(…)全攻略
省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...
- CSS单行、多行文本溢出显示省略号(……)
这个问题经常遇到 1.单行文本溢出显示省略号(…) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 overflow:hidden;text-overflo ...
- css实现多行文本溢出显示省略号(…)全攻略
省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...
- CSS单行、多行文本溢出显示省略号
如果实现单行文本的溢出显示省略号小伙伴们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; t ...
- CSS单行、多行文本溢出显示省略号(……)解决方案
单行文本溢出显示省略号(-) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 .ellipsis{ overflow: hidden; text-overf ...
随机推荐
- WinCE下的串口通信开发(VS2005,VB.Net,VC++)
WinCE下的串口通信开发(VS2005,VB.Net,VC++) WinCE下的串口通信开发 一.利用Visual Basic 开发很简单,因为有现成的控件可以直接调用 以VS2005为例,首先 ...
- Winodws SNMP服务安装和配置(Windows 2003 & 2008 R2)
简单网络管理协议SNMP服务起着代理的作用,它会收集可以向SNMP管理站或控制台报告的信息.您可以使用SNMP服务来收集数据,并且在整个公司网络范围内管理基于Windows Server 2003.M ...
- 【2017年最新】 iOS面试题及答案
设计模式是什么? 你知道哪些设计模式,并简要叙述? 设计模式是一种编码经验,就是用比较成熟的逻辑去处理某一种类型的事情. 1). MVC模式:Model View Control,把模型 视图 控制器 ...
- Zabbix——部署(DB与web分离)
前提条件: 两台centos7设备 两台设备可以相互访问 Zabbix-Servser版本为4.0 mysql版本为8.0 关闭防火墙 Zabbix部署(包含server,web,agent) rpm ...
- ztree的用法
哎哟,好久没写什么这个虽然没人看的博客了,其实这段时间情绪非常低谷,就没有写博客了,不过我还是回来了,回到正题,在前端页面编程的时候,我们经常用到树状,用原始的树状呢,功能没有那么强大,所以这个时候 ...
- Shell中的${}、##和%%使用范例
假设定义了一个变量为,代码如下: file=/dir1/dir2/dir3/my.file.txt 可以用${ }分别替换得到不同的值: ${file#*/}: 删掉第一个 / 及其左边的字符串:di ...
- Python入门 —— 04字符串解析
字符串 -字符串是 Python 中最常用的数据类型.(可以说是大多数语言都常用) 1. 创建字符串 ( '' 或 "" 和 '''''')(单,双和三引号)(字符串可以为空) - ...
- Flask之app实例的参数配置
说是app实例的配置, 实际也就是flask程序的配置 Flask 是一个非常灵活且短小精干的web框架 , 那么灵活性从什么地方体现呢? 有一个神奇的东西叫 Flask配置 , 这个东西怎么用呢? ...
- 微信小程序 —— 仿制豆瓣(一)
先预览一下效果 欢迎扫码查看 码云地址:https://gitee.com/mk_23/little_chen_xu.git 预览完成,首先进入app.json文件中配置参数,主要就是配置我们要用的页 ...
- Docker之centos 简单安装
centos6因为系统自带的可执行的应用程序与 docker 包名字发生冲突,所以重新命名 docker 的RPM包名字为 docker-io. 首先卸载docker包 sudo yum -y rem ...