一般的文字截断(适用于内联与块):
==============CSS================
.text-overflow{
display:block;/*内联对象需加*/
width:31em;
word-break:keep-all;/* 不换行 */
white-space:nowrap;/* 不换行 */
overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden;一起使用。*/
}
=================================
对于表格的话,定义有一点不一样:
==============CSS================
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;一起使用。*/
}
=================================
注:这个东东只对单行的文字的效,如果你想把它用在多行上,也只有第一行有作用的。 这个写法只有IE会有“...”,其它的浏览器文本超出指定宽度时会隐藏。
分享到:
相关推荐
看到标题你一定很容易就会想到截断文字加“…”的做法。哈哈,就是这样。其实写这篇日志也只是把这样方法做个记录,因为好像还有很多人不记得遇到这样的情况该如何处理。.../* 当对象内文本溢出时显示省略标记(…) ;
表示文本不会换行,在同一行继续,知道遇到标签为止;overflow:hidden;不显示超过对象尺寸的内容,就是把超出的部分隐藏了;text-overflow:ellipsis;当文本对象溢出是显示…,当然也可是设置属性为clip不显示...
设置或检索是否使用一个省略标记(…)标示对象内文本的溢出。 对应的脚本特性为textOverflow。 <div xss=removed>a b c d e f g h i j k l , msa sd sd sa w df f ...还必须定义:强制文本在一行内显示(white-space:
当一行文字超过了限定范围,就会出现换行等现象,这就叫文本溢出 该如何解决文本溢出呢,其实只要短短一块css代码即可 (此图片来源于网络,如有侵权,请联系删除! ) 现在界面好看了吧(至少从我的审美出发还可以) ...
代码如下: ... ;height:20px;text-overflow:ellipsis; white-space:nowrap; overflow:hidden; >a b c d e f g h i j k l ,...还必须定义:强制文本在一行内显示(white-space:nowrap)及溢出内容为隐藏
设置或检索是否使用一个省略标记(…)标示对象内文本的溢出。对应的脚本特性为textOverflow。 复制代码代码如下: <div xss=removed>a b c d e f g h i j k l , msa sd sd sa w...还必须定义:强制文本在一行内显示(w
多行文本溢出省略 在做微信公众号开发时,有个需求是这样的 找到了一个方法, 2323文字提示气泡框,在鼠标悬停时显示,代替了系统的title提示。文字提示气泡框,在鼠标悬停时显示,代替了系统的title提示。文字...
超出一行隐藏: overflow:hidden; //超出的文本隐藏 text-overflow:ellipsis; //溢出用省略号显示 white-space:nowrap; //溢出不换行 但是第三条属性,只能显示一行,不能用在这里,那么如果显示多行呢? 超出两行...
ellipsis代表当对象内文本溢出时显示省略标记(…) 需要注意的是,要想这两个属性起真正的作用,需要配合overflow:hidden;white-space:nowrap;使用。 overflow:hidden;代表着超出文本的部分不显示 white-space:...
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览
overflow,当把它设为ellipsis时文本溢出内容就能显示为省略标记,而设为clip时就能把文本溢出的部分裁切掉,当然,前提是设置好两个属性,那就是white-space:nowrap(强制文本在一行内显示)及overflow:hidden...
1. BEGIN 代码块:初始化代码块,在对每一行进行处理之前,初始化代码,主要是引用全局变量,设置 FS 分隔符。 2. 匹配代码块:可以是字符串或正则表达式,用于匹配每一行的内容。 3. 命令代码块:包含一条或多条...
text-overflow 概要:其作用是解决文本溢出时,其展现的形式 该属性有两个参数,分别如下: CSS Code复制内容到剪贴板 ... white-space:nowrap:给文本容器设置强制不换行,让元素文本在一行内显示。 overflow:hid
(此图片来源于网络,如有侵权,请联系删除! ) 用于标题文本太长显示不下的场景 控制只显示...对于平时只显示一行的,代码要更加简单一些 overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
利用多行溢出实现“展开”“收起” 多行溢出省略Css: overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; 设计是这样的。。 点击...
是注释bug,经典的ie bug。 说明:注释造成文字溢出是IE的BUG,注释造成文字溢出与其位置有关,注释造成文字溢出与文字区块的固定宽度有关,溢出文字的字数=... 当溢出的文字字数大于文本的字数时,文字区块将会消失。
用 python 处理一个文本时,想要删除其中中某一行,常规的思路是先把文件读入内存,在内存中修改后再写入源文件。 但如果要处理一个很大的文本,比如GB级别的文本时,这种方法不仅需要占用很大内存,而且一次性读入...