CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行
CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行。
一般的文字截断(适用于内联与块):
.text-overflow {
display:block;/*内联对象需加*/
width:31em;
word-break:keep-all;/* 不换行 */
white-space:nowrap;/* 不换行 */
overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden;一起使用。*/
}
对于表格文字溢出的定义:
对于表格超出范围显示省略号
table{
width:30em;
table-layout:fixed;/* 只有定义了表格的布局算法为fixed,下面td的定义才能起作用。 */
}
td{
width:100%;
word-break:keep-all;/* 不换行 */
white-space:nowrap;/* 不换行 */
overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden;一起使用。*/
}
需要你注意的是,这个CSS样式只对单行的文字的效,如果你想把它用在多行上,也只有第一行有作用的。 这个写法只有IE会有“...”,
其它的浏览器文本超出指定宽度时会隐藏。
以上问题可以解决:使用CSS如何控制文本换行?使用CSS如何控制文本不换行?使用CSS如何控制文本超出范围后显示省略号?使用CSS如何控制文本超出范围后隐藏?感谢您的光临~~~
CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行的更多相关文章
- CSS控制TD内的文本超出指定宽度后不换行而用省略号代替
<style type="text/css"> .lineOverflow { width: 100px; border:#000 solid 1px; text-ov ...
- CSS控制文本超出指定宽度显示省略号和文本不换行
一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加 */ width:31em;/* 何问起 hovertree.com */ word ...
- CSS- 文本超出指定宽度后隐藏并显示为省略号
一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加*/ width:25em; word-break:keep-all;/* 不换行 * ...
- CSS设置超出指定宽度自动换行
一.背景 最近项目中有用到在div中显示用户反馈的信息,是指定宽度的div,超出要自动换行,开始写好后感觉应该没什么问题,后来自己随便输入测试数据的时候发现:如果是纯字母或者是纯数字就会出现超出了也不 ...
- css 文本超出容器长度后自动省略的方法!
我们在给用户显示文本内容的时候,往往需要避免文本内容超出容器宽度,防止换行溢出,小弟在网上找了下发现网上的实现仅仅只是实现了用 ...省略了的功能! 而并没有获取光标提示的功能,所有小弟就结合网上的代 ...
- CSS文本超出指定行数省略显示
单行: overflow: hidden; text-overflow: ellipsis; white-space: nowrap; 2行: font-size: 17px;overflow: hi ...
- Html内容超出标记宽度后自动隐藏
我们在显示长文本时,往往需要去在C#端去截取字符,但这绝对不是一个好方面,因为我们的长文本往往都是代HTML标记的,你一个载不好,就会出现乱码问题(出现半个HTML标记),而比较好的作法就是通过CSS ...
- awk添加文本到指定内容后一行
一下操作会输入到文件末尾,,测试不全面,还不如使用echo解决呢... 1. 要添加的文本内容如下: 文件名:code_list html</>!@$%^^ fdsafds <> ...
- css 超过标签定义的宽度后显示----
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- zoj2132-The Most Frequent Number
http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=2132 The Most Frequent Number Time Limi ...
- [开发笔记]-VS2012打开解决方案崩溃或点击项目崩溃
下午在使用VS2012建立Service服务项目时,只要一切换到设计视图页面中,VS就崩溃重启,从网上找了一种方法来解决,测试可行.但导致该问题的原因未知. 解决方案: 步骤1:开始-->所有程 ...
- java枚举类
enum关键字用于定义枚举类,若枚举只有一个成员, 则可以作为一种单例模式的实现方式. 枚举类对象的属性不应允许被改动, 所以应该使用 private final 修饰. 枚举类的使用 priva ...
- MonoRail学习:可重复组件ViewComponents的使用
在MonoRail中我们可以定义一些可重用的组件,在其他需要使用的页面引入这个组件就可以了.有点相当于.NET中的自定义控件,可以节约代码,方便开发,提高重用性. 在MonoRail中把这一功能叫做V ...
- 利用ps指令查看某个程序的进程状态
ps -ef是查看所有的进程,然后用grep筛选出你要的信息. eg.
- 统计一段文字中出现频率最高的10个单词(c语言)
注:这次使用C语言做的这个程序.个别不懂的地方和算法部分是请教的其他同学,交流并吸收,所以收获颇多! 在程序中每一个地方我都做了注释,方便同学之间交流.也让老师容易看.程序也有很多不足的地方,但限于本 ...
- 2013年8月份第1周51Aspx源码发布详情
校企工作室OA源码 2013-8-9 [VS2010]源码描述:主要模块及系统管理功能说明:一.考勤功能模块:考勤分成三个功能,显示签到功能,查询功能,管理功能.1.签到功能分析:在签到功能中,我们 ...
- RESTful Web Services测试工具推荐
命令行控的最爱:cURL cURL是一个很强大的支持各种协议的文件传输工具,用它来进行RESTful Web Services的测试简直是小菜一碟.这个工具基本上类Unix操作系统(各种Linux.M ...
- Motorola C118修改滤波器组件
所需工具: 热风枪.恒温焊台.镊子.助焊膏.锡丝.滤波器组件 关于怎么使用热风枪拆屏蔽盖将在后期更新视频,以下为修改滤波器流程.以下热风枪设置温度只针对快克957DW(不同品牌风枪和型号可能会有温差) ...
- Inno_setup制作升级包必须面临的几个问题
Inno_setup制作升级包必须面临的几个问题 分类: c/c++/GamingAnyWhere JavaScript linux shell基础知识 2013-12-18 22:14 1496人阅 ...