首页 > Web开发 > 详细

css隐藏多余文字显示...

时间:2014-12-22 00:45:41      阅读:447      评论:0      收藏:0      [点我收藏+]
<style>
.ellipsis{width:100px; overflow:hidden; text-overflow:ellipsis; white-space: nowrap;}
.ellipsis:hover{overflow: visible;}
</style>
<div class="ellipsis">css隐藏多余文字并用...表示未完的内容</div>

 

使用到的css属性

width:***, overflow:hidden, text-overflow:ellipsis多余的文字用...显示。, white-space:nowrap保持文字在一行显示不折行

text-overflow:clip | ellipsis;

  clip:修剪文本。

  ellipsis:显示省略符号来代表被修剪的文本。

 

css隐藏多余文字显示...

原文:http://www.cnblogs.com/wanbi/p/4177309.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!