html 固定长度 超出长度 显示省略号
a{
width: 80px;/* 要显示文字的宽度 */
float: left;/* 左对齐,不设置的话只在IE下好用 */
overflow: hidden; /* 超出的部分隐藏起来 */
white-space: nowrap;/* 不显示的地方用省略号...代替 */
text-overflow: ellipsis;/* 支持 IE */
-o-text-overflow: ellipsis;/* 支持 Opera */
}
例:
<div style="display: inline-block;overflow: hidden;width: 50px;word-break: keep-all;white-space: nowrap;text-overflow: ellipsis;line-height: 28px;float: left;">dfdsfdsfffffffffffffffffffff</div>
html 固定长度 超出长度 显示省略号的更多相关文章
- css控制标题长度超出部分显示省略号
width: 50px; overflow:hidden;white-space:nowrap; text-overflow:ellipsis; 设置或检索是否使用一个省略标记(...)标示对象内文本 ...
- css 超出部分显示省略号
代码: overflow: hidden; white-space: nowrap; text-overflow: ellipsis; 重点代码:text-overflow: ellipsis; 解 ...
- CSS实现单行、多行文本超出部分显示省略号
单行文本超出,代码如下: css代码: <style> .one{ width:200px; overflow: hidden; text-overflow:ellipsis; whit ...
- Table组件设置文字超出宽度显示省略号,鼠标悬停以悬浮框显示
一.设置文字超出宽度显示省略号 注意点: 1. 需要指定column的width属性,否则列头跟内容可能不对齐.需要留一列不设置宽度以适应弹性布局. 2. 列宽度width必须大于ellipsis的 ...
- HTML5 元素文字超出部分显示省略号(支持多行),兼容几乎所有常用浏览器
1,公共样式,在公共的 CSS 文件中加入以下内容 /* 超出部分显示省略号,支持多行 */ .text-ells:before { content: ''; float: left; width: ...
- css文字超出自动显示省略号
只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...
- JS控制文字只显示两行,超出部分显示省略号
由于使用css控制文字只显示多行,超出部分显示省略号,存在一定的兼容性问题,所以总结了一下网上一些大咖使用js实现控制行数的解决方案. 第一步:依次引入jquery.js+jquery.ellipsi ...
- css文本强制两行超出就显示省略号,不显示省略号
1. 强制一行的情况很简单 overflow:hidden; //超出的隐藏 text-overflow:ellipsis; //省略号 white-space:nowrap; //强制一行显示 2. ...
- CSS——文本超出隐藏显示省略号
文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...
- css限制显示字数,文字长度超出部分用省略号表示【转】
为了保证页面的整洁美观,在很多的时候,我们常需要隐藏超出长度的文字.这在列表条目,题目,名称等地方常用到. (1).文字超出一行,省略超出部分,显示'...' 如果这种情况比较多,可以取一个切合作用的 ...
随机推荐
- 守护客户数据价值:企业级NewSQL HTAP分布式云TBase架构详解
欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 作者:jasonys,隶属于腾讯技术工程事业群数据平台部,负责TBase数据的技术研发和架构设计,有超过10年的数据库内核开发设计经验,完成 ...
- Oracle服务器重命名
转载自:http://www.codesec.net/view/120387.html 因工作需要准备了一台服务器专门按照oracle数据库,并且服务器上安装了windows 2008R2操作系统,在 ...
- Become a Better Programmer: 5 Essential Methods at a Glance--reference
http://www.git-tower.com/blog/become-a-better-programmer-5-essentials/ Become a Better Programmer: 5 ...
- 从Zero到Hero,一文掌握Python关键代码
# 01基础篇 # 变量 #int one=1 some_number=100 print("one=",one) #print type1 print("some_nu ...
- 从零实现一个简易jQuery框架之一—jQuery框架概述
我们知道,不管学习任何一门框架,了解其设计的理念.目的.总体的结构及核心特性对我们使用和后续的深入理解框架都是有很大的帮助的.因此在这里先梳理一下本人对jQuery框架的一些理解. 设计目的(为什么要 ...
- 对key中有数字的字典进行排序
word_cloud = []cc = [{"c58":341,"c59":525,"c56":507,"c57":34 ...
- Javaweb三大组件-过滤器、监听器
1. 过滤器 [filter] 作用: 对单个获取多个servlet起到增强[advice]的作用. 用于在所有的servlet执行前,做一些预处理.例如:做编码处理, 访问量统计[servletCo ...
- JavaSE环境Shiro的搭建及常用API
通过shiroAPI来进行角色的管理 模拟用户是否登录: 模拟用户是否具有相应的权限:
- CSS之背景的填充范围
1.资料:CSS2.1 进行了更正:元素的背景是内容.内边距和边框区的背景 2.也就是说背景颜色,background-color:这些会填充内边距和边框border, 而不会填充外边框margin的 ...
- scss-字符串连接符
+ 运算可用于连接字符串: // SCSS p { cursor: e + -resize; } // 编译后的 CSS 样式 p { cursor: e-resize; } 请注意,如果带引号的字符 ...