找回密码
 注册会员
查看: 591|回复: 0

如何通过CSS自动隐藏超出宽度的字不带省略号

[复制链接]
发表于 2010-4-15 13:44:29 | 显示全部楼层 |阅读模式
<p>如何通过CSS自动隐藏超出宽度的字不带省略号</p>
<p><img src="http://img.baidu.com/img/iknow/icn_point.gif"> 悬赏分:0 -</p>
<p>解决时间:2010-4-15 13:44</p>
<p>如何通过CSS自动隐藏超出宽度的字要求ie下不带省略号</p>
<p>提问者: 紫se晨风 - 二级</p>
<p>最佳答案</p>
<p>一般的文字截断(适用于内联与块):</p>
<p>.text-overflow {</p>
<p>display:block;/*内联对象需加*/</p>
<p>width:31em;</p>
<p>word-break:keep-all;/* 不换行 */</p>
<p>white-space:nowrap;/* 不换行 */</p>
<p>overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */</p>
<p>text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden;一起使用。*/</p>
<p>}</p>
<p>对于表格文字溢出的定义:</p>
<p>table{</p>
<p>width:30em;</p>
<p>table-layout:fixed;/* 只有定义了表格的布局算法为fixed,下面td的定义才能起作用。 */</p>
<p>}</p>
<p>td{</p>
<p>width:100%;</p>
<p>word-break:keep-all;/* 不换行 */</p>
<p>white-space:nowrap;/* 不换行 */</p>
<p>overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */</p>
<p>text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden;一起使用。*/</p>
<p>}</p>
<p>有...是ie的bug,在其他浏览器里不会有...</p>
<p>0</p>
<p>回答者:</p>
<p>旅途未完 - 五级   2010-4-1 14:35</p>
<p>我来评论>></p>
<p>提问者对于答案的评价:</p>
<p>不是想要的效果,但写的比较详细。</p>
您需要登录后才可以回帖 登录 | 注册会员

本版积分规则

QQ|文字版|手机版|小黑屋|襄阳城

GMT+8, 2025-5-23 05:31

Powered by Discuz! X3.5

© 2001-2024 Discuz! Team.

快速回复 返回顶部 返回列表