`
toyota2006
  • 浏览: 553921 次
  • 性别: Icon_minigender_1
  • 来自: 石家庄
社区版块
存档分类
最新评论

使用 CSS来完成 表格、span 中用省略号 ...代替过长文字

阅读更多
<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
table{table-layout: fixed}
td {text-overflow:ellipsis;overflow: hidden;}
span {display:block;
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;/*just for IE */}
</style>
</head>
<body>
<table border="1" width="355px" >
<tr >
 <td>aaaaaaaaaaaaaaaaaaa!</td>
 <td title="">aaaaaaaaaaaaaaa</td>    
<td>123333333333333333333333333333333333</td>
<td>123333333333333333333333333333333333</td>
<td>123333333333333333333333333333333333</td>
<td><center><span  style='background-color: transparent;' title=11:00---24:00>11:00---24:00</center></span<td>
</tr>
</table>
<body>
</html>
分享到:
评论
8 楼 kaowww153 2010-03-16  
难道就没有一个游览器全兼容的吗
7 楼 dsjt 2010-01-24  
楼主的代码
其中一单元格内容换成中文就出问题了
6 楼 wukele 2009-12-13  
还不错,起码在ie中不用程序判断长度了
5 楼 topcode 2009-12-11  
only IE
4 楼 bluemeteor 2009-12-09  
cxd110 写道
firefox不能正常显示


正解,FF的解决方案请搜索ellipsis.xml
3 楼 cxd110 2009-12-09  
firefox不能正常显示
2 楼 zbm2001 2009-12-09  
binlaniua 写道
Jinja2模板
直接用一个filter就可以了

{{showContent|truncate(length=20,end='...')}}


若是字体样式定义大一些

若是掺杂了中英文字体(或其他语言)

若是采用了非等宽字体

……以上等着走光喽

总之,后台输出对前端表现的控制具有不可预知性,至少要有约定和权衡,完全依赖它更是不可取

1 楼 binlaniua 2009-12-08  
Jinja2模板
直接用一个filter就可以了

{{showContent|truncate(length=20,end='...')}}

相关推荐

Global site tag (gtag.js) - Google Analytics