word-break: break-all; text-overflow: ellipsis; display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/ -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 ...
.p display: webkit box overflow: hidden webkit box orient: vertical text overflow: ellipsis webkit line clamp: ...
2019-11-29 11:49 0 559 推荐指数:
word-break: break-all; text-overflow: ellipsis; display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/ -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 ...
做这个省略的问题,突然发现显示省略号是有中英文区分的 我做两行的时候用的是以下代码,在是中文的情况下是么得问题,到了英文下发现不起作用了 原来是得加上 word-break: break-all; 加上这个的话 在中英文下都可以正常使用 注意:只兼容 Chrome内核 ...
效果图: 注意点:看代码有webkit自然也就chrome支持好,其他浏览器就。。啧啧啧 ...
页面内容 js部分 css部分 ...
超出显示省略号 overflow: hidden;white-space: nowrap;text-overflow: ellipsis; 两行之后超出显示省略号 text-overflow: -o-ellipsis-lastline; overflow: hidden ...
最近接到一个需求,要求商场导航里的文字最多显示两行,超出两行的省略号显示,查一些资料,又根据自己的需求,改了很多,直接上代码吧 <html> <head> <style type="text/css"> ...