发文章
发文工具
撰写
网文摘手
文档
视频
思维导图
随笔
相册
原创同步助手
其他工具
图片转文字
文件清理
AI助手
留言交流
CSS3新增text-overflow: ellipse; 只支持单行文本
如果是多行文本, 在无法完全显示的情况下,可以按下面这样写:
overflow:hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
来自: WindySky > 《HTML5》
0条评论
发表
请遵守用户 评论公约
仅使用Css属性实现文本限制行数
仅使用Css属性实现文本限制行数.p { display: -webkit-box;-webkit-line-clamp: 3;//控制显示的行数 -webkit-box-orient: vertical; text-overflow: ellipsis; //超出行数部分使用省略号来结尾 overflo...
多行文本溢出显示省略号(...)的方法 | 小影志
现在的浏览器都支持text-overflow:ellipsis属性,用来实现单行文本的溢出显示省略号,但是这个属性并不支持多行文本。-webkit-line-clamp.Webkit支持一个名为-webkit-line-clamp的属性,他其实是一个We...
CSS实现文本溢出的部分用省略号代替的方法
CSS实现文本溢出的部分用省略号代替的方法。CSS:{width:xxpx;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;},截取为clip;但是这个属性只支持单行文本的溢出显示省略号,如果我们要实...
单行文本出现省略号必备的条件(面试题)
单行文本出现省略号必备的条件(面试题)单行文本出现省略号必备的4个条件缺一不可:width宽度(不写宽度默认继承父元泰的宽度)overflow:hidden溢出隐臧white-space:nowrap;强制不折行text-overtlo:ellipsi...
使用CSS实现无滚动条滚动
《潇洒走一回》《涛声依旧》《昨夜星辰》《一剪梅》《雾里看花 - 西瓜视频 - 个人
" href="https://www.ixigua.com/7059687443137561091" target="_self" style="box-sizing: border-box;cursor: pointer;line-height: 20px;font-size: 15px;display: -...
CSS实现 ul li文本过长显示省略号的好方法(兼容IE6 IE7 FF)
CSS实现 ul li文本过长显示省略号的好方法(兼容IE6 IE7 FF)CSS超出文本用省略号显示 兼容firefox IE6 IE7.<title>css写省略号方法</title>padding: 12px 4px 12px 24px;li {li a {/* li ...
CSS3属性之五:text-overflow
text-overflow : clip | ellipsis取值:DOCTYPE html><html><head><title>text-overflow demo</title><...
实现文字的省略号
实现文字的省略号在项目中有涉及实现一行或者第几行后加省略号,在实现第几行后加省略号的时候,使用的是-webkit-line-clamp、-webkit-box-orient属性,会出现webpack打包-webkit-box-orient属性被忽略...
微信扫码,在手机上查看选中内容