欢迎来到懒人图库! 返回首页 网站地图 懒人工具箱

CSS强制不换行超过div部分长度采用省略号

2017-02-10 来源/作者:懒人图库 分类:文字特效 «»
运行代码保存代码 提示:您可以先修改部分代码再运行,保存代码功能在Firefox下无效。

场景描述:在条目列表中经常遇到,要求固定高度的一行文本,随着窗口页面的收缩或分辨率的调整,对该文本进行隐藏展示,超过部分采用省略号“...”来表示。

DIV基本原理:三行CSS代码

1、white-space:nowrap;white-space属性表示设置如何处理元素内的空白,nowrap表示文本不会换行,文本会在在同一行上继续,直到遇到标签为止。

2、overflow:hidden;overflow属性表示规定当内容溢出元素框时发生的事情hidden表示内容会被修剪,并且其余内容是不可见的。

3、text-overflow: ellipsis;text-overflow属性表示规定当文本溢出包含元素时发生的事情ellipsis表示显示省略符号来代表被修剪的文本。

标签:文字特效
相关代码推荐