css 样式文字溢出显示省略号
在table中使用溢出样式,table样式要设置为”table-layout: fixed“,即<table style="table-layout: fixed;">,溢出样式才有效果
table tbody tr td
{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
注释:
white-space:nowrap;表示文本不会换行,在同一行继续,知道遇到<br>标签为止;
overflow:hidden;不显示超过对象尺寸的内容,就是把超出的部分隐藏了;
text-overflow:ellipsis;当文本对象溢出是显示...,当然也可是设置属性为clip不显示点点点;
程序员的基础教程:菜鸟程序员
css 样式文字溢出显示省略号的更多相关文章
- css文字溢出显示省略号
1.单行文字溢出显示省略号. overflow: hidden; text-overflow: ellipsis; white-space: nowrap;//文本不换行 2.多行文本溢出显示省略号. ...
- CSS换行文本溢出显示省略号
现代浏览器中使用css可以实现文本溢出,使用 text-overflow: ellipsis;在有些场景下没有效果,这个时候你需要检查应用的场景是是否是块元素,是否有确切的width. 如果是行内元素 ...
- CSS单行文本溢出显示省略号
此为转载,原文地址 项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英 ...
- 文字溢出显示省略号,兼容ie9以上浏览器
最近遇上一个问题,文字溢出展示省略号在ie上不管用,经过查找,是少了word-wrap: normal;这个css属性 width:100px; overflow: hidden; white-spa ...
- CSS 文本和表格中文字溢出显示省略号
CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行. 一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加*/ ...
- td文字溢出显示省略号
昨天遇到移动端表格td中文字溢出问题,写了溢出隐藏样式,居然没起作用! { overflow:hidden;//溢出隐藏 white-space:nowrap;//文字不换行 text-overflo ...
- css实现文本溢出显示省略号
看到很多网站上的文章列表只显示一部分,之后就是一个阅读全文链接,或者是以一个省略号结尾.今天就说说单行文本,多行文本溢出时怎么显示省略号? 单行 overflow: hidden; white-spa ...
- 【CSS】文字超出显示省略号&连续字符换行
方法1.多行控制(css3) .text { width: 100%; word-break: break-all; display: -webkit-box; -webkit-line-clamp: ...
- CSS换行文本溢出显示省略号,多行
首先,div部分 <body> <div>多行的显示该如何解决呢,后面经过一番google后,我找到了chrome的一个API可以解决上面提到的需求-webkit-line-c ...
随机推荐
- test20181219(期末考试)
Written with StackEdit. \(noip\)爆炸后就好久没考试了...结果今天又被抓去,感觉很慌啊... 考完了.过来填坑. T1 Description 使得\(x^x\)达到或 ...
- kali视频(16-20)学习
第五周 kali视频(16-20)学习 16.漏洞分析之数据库评估(一) 17.漏洞分析之数据库评估(二) 18.漏洞分析之WEB应用代理 19.漏洞分析之burpsuite 20.漏洞分析之fuzz ...
- Net Core ElasticSearch入门
ElasticSearch入门 附.Net Core例子 https://www.cnblogs.com/CoderAyu/p/9564977.html 1.什么是ElasticSearch? Ela ...
- JavaScript define
1. AMD的由来 前端技术虽然在不断发展之中,却一直没有质的飞跃.除了已有的各大著名框架,比如Dojo,jQuery,ExtJs等等,很多公司也都有着自己的前端开发框架.这些框架的使用效率以及开发质 ...
- gradle wrapper 简单使用
其实就是对于gradle 的一个包装,保证了项目版本的一致,同时减少配置 1. 生成wrapper // 使用gradle wrapper 命令 gradle wrapper 输出效果如下: [r ...
- EXCEL类型库的添加
1. 创建新的C++工程 创建基于对话框的MFC程序 2. 添加库.添加Excel类库 在工程名上右键,选择“添加”—“类”(或者点击菜单栏的“项目”->“添加类”),选择“TypeLib中的M ...
- appium 中swipe()方法向左滑动时
应该在UI Automator Viewer中读取到的例如ImageView [180,600][900,1320],如果要左滑,代码中应该是写为driver.swipe(900,1320,180,6 ...
- 【OpenCV函数】轮廓提取;轮廓绘制;轮廓面积;外接矩形
FindContours 在二值图像中寻找轮廓 int cvFindContours( CvArr* image, CvMemStorage* storage, CvSeq** first_cont ...
- mybatis 动态sql语句(2)
什么是动态SQL MyBatis的一个强大特性之一通常是它的动态SQL能力.如果你有使用JDBC或其他相似框架的经验,你就明白条件串联SQL字符串在一起是多么地痛苦,确保不能忘了空格或者在列表的最后的 ...
- mysql安装与基本管理
一.MySQL介绍 MySQL是一个关系型数据库管理系统,由瑞典MySQL AB 公司开发,目前属于 Oracle 旗下公司.MySQL 最流行的关系型数据库管理系统,在 WEB 应用方面MySQL是 ...