当前位置： 移动技术网 > IT编程>网页制作>CSS > 文本超出隐藏 综合整理

文本超出隐藏 综合整理

2018年04月03日  | 移动技术网IT编程  | 我要评论

最近的开发中，文本超出隐藏总是一个没有得到完整解决的问题，现在整理一遍，虽然也没有得出一劳永逸的方案。

PURE CSS

单行隐藏

需要限制 width

overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;

多行隐藏

移动端支持度很好，很方便，也不需要限制width

display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;

任意行，只超出时对末尾显示渐变点点点

重点是这个
这是自己模拟文本超出后的效果，不依赖原生
很巧妙的利用了浮动的特点，只看代码的话，兼容起码有ie9+， 手头没ie还没具体测试
(原文)[]
(可以配合翻译一起看)[]

JS

(clamp.js)[https://github.com/josephschmitt/Clamp.js]

其实没用过这个库，只是看有人推荐， 也没有考虑过使用js做这种事情

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网