码迷,mamicode.com
首页 > 其他好文 > 详细

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

时间:2015-10-13 20:49:23      阅读:174      评论: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
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!