首页 > 其他 > 详细

单行长度过长显示为省略号

时间:2015-10-13 20:47:19      阅读:256      评论:0      收藏:0      [点我收藏+]

今天get 了css新样式:

控制一行一行的文本如果太长,就用省略号显示:

样式如下:

 .myStyle{width:160px;height:50px;line-height:50px;border:4px solid #eee;
        white-space:nowrap;/*强制文本在一行内显示*/
        text-overflow:ellipsis; /*溢出省略号,支持ie、safari(webkit)*/
        -o-text-overflow:ellipsis; /*溢出省略号,支持opera*/
        overflow:hidden;/*溢出隐藏*/
        -moz-binding:url(‘ellipsis.xml#ellipsis‘);/*溢出省略号,支持firefox*/}
<body>
    <div class="myStyle">文本长了就省略号显示文本长了就省略号显示文本长了就省略号显示</div>
</body>

显示效果如下:

技术分享

 

单行长度过长显示为省略号

原文:http://www.cnblogs.com/wangshiping/p/4875531.html

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