css实现超出文本溢出用省略号代替
一、单行
实现单行文本的溢出显示省略号使用text-overflow:ellipsis属性,但需要配合使用另外两个属性使用才能达到效果。
如下:
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
效果:
二、多行
不考虑兼容性,适用于Webkit浏览器内核
css代码:
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-box-clamp:3 //截取第三行
overflow:hidden;
效果:
css实现超出文本溢出用省略号代替的更多相关文章
- CSS实现单行文本溢出显示省略号
p { width:100px;//设定宽度 //以下三个属性设置均必不可少 white-space: nowrap; text-overflow:ellipsis; overflow:hidden; ...
- CSS文本溢出显示省略号
项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英雄指教. 单行 语法 ...
- CSS单行文本溢出显示省略号
此为转载,原文地址 项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英 ...
- CSS换行文本溢出显示省略号
现代浏览器中使用css可以实现文本溢出,使用 text-overflow: ellipsis;在有些场景下没有效果,这个时候你需要检查应用的场景是是否是块元素,是否有确切的width. 如果是行内元素 ...
- CSS和JS实现文本溢出显示省略号
本文记录实现文本溢出显示省略号的几种方式. 单行文本 三行CSS代码实现: overflow: hidden; // 文本溢出隐藏 text-overflow: ellipsis; // 显示省略号 ...
- CSS3文本溢出显示省略号
CCS3属性之text-overflow:ellipsis;的用法和注意之处 语法: text-overflow:clip | ellipsis 默认值:clip 适用于:所有元素 clip: 当对象 ...
- css实现超出一行后用省略号显示
css实现超出一行后用省略号显示 a{display:inline-block; text-overflow:ellipsis; white-space:nowrap; overflow:hidden ...
- 文本溢出显示省略号,CSS未加载时a标签仍可用处理方法
一.文本溢出打点 (1)单行文本 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; (2)多行文本 overflow : h ...
- 如何解决Css属性text-overflow:ellipsis 不起作用(文本溢出显示省略号)
如何使text-overflow:elipsis起作用? 想要使用css属性text-overflow:elipsis起到作用,样式必须跟overflow:hidden; white-space:no ...
随机推荐
- WPF中StringFormat的用法
原文:WPF中StringFormat的用法 WPF中StringFormat的用法可以参照C#中string.Format的用法 1. C#中用法: 格式化货币(跟系统的环境有关,中文系统默认格式化 ...
- cocos2D-X从的源代码的分析cocos2D-X学习OpenGL(1)----cocos2D-X渲染架构
个人原创.欢迎转载,转载请注明原文地址http://blog.csdn.net/bill_man 从本篇文章開始,将分析cocos2D-X 3.0源码,第一部分是从cocos2D-X学习OpenGL ...
- Dijkstra含权图最短路径;审判,不要错过枚举退款保证不会重复;国际象棋八皇后问题
求两节点的最短通路.对于无权图,能够通过图的广度优先遍历求解.含权图一般通过Dijkstra算法求解. import java.util.ArrayList; import java.util.Has ...
- JAVASCRIPT高程笔记-------第八章 浏览器BOM对象
8.1 window对象--表示一个浏览器的实例 在全局作用域中声明的任何变量.函数都会变成window对象的属性和方法,与之直接定义window对象的属性的区别是 window.xxx 可以通过 ...
- byte[] 左移和右移
public static class ex { public static byte[] RightShift(this byte[] ba, int n) { ) { return ba.Left ...
- Wpf发送接收 win32消息
#region WPF发送和接收win32消息 public const int WM_GETTEXT = 0x0D; public const int WM_SETTEXT = 0x0C; publ ...
- Win8Metro(C#)数字图像处理--2.29图像除法运算
原文:Win8Metro(C#)数字图像处理--2.29图像除法运算 [函数名称] 图像除法函数DivisionProcess(WriteableBitmap src, WriteableBit ...
- git 笔记-初始化
进入项目所在的文件夹 git init git remote add origin https://github.com/enderlu/test.gitgit push -u origin mast ...
- 十七 bootstrap-table tableExport 导出xlsx格式表格
原文:十七 bootstrap-table tableExport 导出xlsx格式表格 在[十六.bootstrap-table javascript导出数据]中,打开导出的表格时,总会弹出一个提示 ...
- SqlServer & Windows 可更新订阅立即更新启用分布式事务协调器(MSDTC)
原文:SqlServer & Windows 可更新订阅立即更新启用分布式事务协调器(MSDTC) 在可更新订阅中,在订阅设置更新方法,将 "排队更新" 设置为 " ...