javascript和JQuery焦点图和代码特效大全
当前最流行的开源CMS网站系统大全
当前位置:主页 > WEB前端 > CSS-HTML >

CSS样式自适应宽度省略字符

来源:IT技术网编辑:一页书发布于:2013-07-01人围观CSS样式宽度字符

在日常的项目中,我们常常会遇到有些标题过长的时候会用"..."来缩略字符。很多时候也会用PHP来截取并加"...",但是我们通过CSS样式也可以来实现这个效果。下面请看代码:
<meta charset="UTF-8" />
<style type="text/css">
.ellipsis {
    white-space: nowrap; /*保留文字间的空白*/
    width: 200px;
    overflow: hidden;  /*超出部分隐藏,*/
    text-overflow: ellipsis; /*超出部分显示成... */
    border:1px solid #333;
}
</style>
<div class="ellipsis"> 这个是自适应宽度并把超出的部表示的css样式代码分用。。。。收藏~ </div>

CSS,样式,宽度,相关的文章
有时间的话来看看IT界的突发事件