单行文本

_单行文本的情况下，用省略号“...”隐藏超出范围的文本

时间：2013/9/15 20:38:21 作者：456lives 来源：网络 查看：887 评论：0 内容摘要：在日常的学习中或工作中很多时候都要用到文字超出了需要隐藏并显示省略号的情况，我想很多人都碰到过吧，舒适慢生活学习网的小编总结了一下，这个有两种解决方法可以解决：

在日常的学习中或工作中很多时候都要用到文字超出了需要隐藏并显示省略号的情况，我想很多人都碰到过吧，舒适慢生活学习网的小编总结了一下，这个有两种解决方法可以解决：

方法一：用程序开截取字符长度，这个比较简单，这里就不做演示了。

方法二：用样式来做，这种方法比较常用，所以今天主要介绍一下用样式怎么来做，我话也不多说了吧直接上代码吧（要注意的是，这种方法只适用于单行文本，如果是多行文本，请查看本站其它教程）

css样式如下：

<style type="text/css"> .css1{ color:#6699ff;border:1px #ff8000 dashed; margin-bottom:20px; width: 20em;/*不允许出现半汉字截断*/ } .css2 { overflow: hidden; /*自动隐藏文字*/ text-overflow: ellipsis;/*文字隐藏后添加省略号*/ white-space: nowrap;/*强制不换行*/ width: 20em;/*不允许出现半汉字截断*/ color:#6699ff;border:1px #ff8000 dashed; } </style>_

转载于:https://my.oschina.net/zhuyingming/blog/678337