你还在截取标题的长度吗

我相信凡是做过网站开发的朋友都为信息提取时，显示信息列表的标题长度做过思考和努力（当然我也是这样），一般的我们把标题定一个长度，超出了就将其截断，并加上省略号以表示标题未完，如果标题是汉字数字特殊字符混合组成的，还要为其显示做特殊处理。从现在开始我梦再也不用这样烦心了。我是从这里学到的。其实就是把标题的容器设置为overflow:hidden。

效果图：

下面是例子：
普通：

标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容 2007-08-26
标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容 2007-08-26
标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容 2007-08-26
标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容 2007-08-26
处理过的
标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容
2007-08-26
标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容
2007-08-26
标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容
2007-08-26
标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容标题内容
2007-08-26

经网友提醒，的确可以用css做到标题过长用...代替的做法。下面是具体代码：
内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容
内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容
内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容

posted @ 2007-09-06 18:34 布尔 阅读(799) 评论(12)  编辑 收藏 所属分类: Javascript

  回复  引用  查看    
#1楼 2007-08-26 09:32 | kiler      
截取标题没有什么意思，怎么截效果都不好，还不如像动易cms那么处理，文章加上一个短标题字段，由用户自己写一个短标题。
  回复  引用  查看    
#2楼 2007-08-26 11:26 | 丁学      
截标题怎么做都不好看，overflow:hidden也不好看，而且还得想着浏览器
  回复  引用  查看    
#3楼 [楼主]2007-08-26 11:56 | 布尔      
@kiler
谢谢关注，也许是吧，不过我觉得这比截取字符串要简单一些
  回复  引用  查看    
#4楼 2007-08-26 21:39 | 鸟菜品极      
加上text-overflow:ellipsis;width:长度;white-space:nowrap; 效果更好.
  回复  引用  查看    
#5楼 2007-08-26 21:44 | 蓝星空      
这个方法太棒了！

不管实用不实用，至少我又多知道了一种截取的办法了
  回复  引用  查看    
#6楼 [楼主]2007-08-27 06:33 | 布尔      
@鸟菜品极
谢谢
@蓝星空
能用到就好
  回复  引用    
#7楼 2007-08-27 13:54 | seamusic [未注册用户]
我觉 得用CSS的不错，好像还可以自动加。。。的。
  回复  引用  查看    
#8楼 [楼主]2007-09-06 20:32 | 布尔      
@seamusic
已经整理过来，谢谢提醒
  回复  引用  查看    
#9楼 2007-09-07 16:19 | 沉默是金      
overflow:hidden;text-overflow:ellipsis

呵呵。楼主你没有想过这段代码在FF里是否兼容？
  回复  引用  查看    
#10楼 2007-09-07 16:23 | 沉默是金      
而且一选择该内容就露馅！！
text-overflow:ellipsis经不起验证。。

我至今也为这事苦恼。我基本上还用是substring().
欢迎大家探讨
  回复  引用  查看    
#11楼 [楼主]2007-09-07 19:10 | 布尔      
呵呵，还好我的用户能接受，而且这样绝对整齐。
  回复  引用  查看    
#12楼 [楼主]2007-09-07 19:11 | 布尔      
@沉默是金
难道css不是标准吗？

标题  
姓名  
主页
Email (博主才能看到) 
验证码 *  看不清,换一张 [登录][注册]
内容(请不要发表任何与政治相关的内容)  
   博客园首页

  新闻频道

  社区

  小组

  博问

  网摘

  闪存
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      
该文被作者在 2007-09-09 08:57 编辑过
成果网帮您增加网站收入


相关链接:

最新IT新闻:
Google申请“海上数据中心”专利 可能付诸行动
用Google Earth实时追踪人造卫星
传IBM将以35亿美元至40亿美元收购北电
Google卫星已经开始工作
Chrome又曝漏洞 “保存为”功能“引狼入室”