文本溢出显示省略号
Posted justsmile2
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了文本溢出显示省略号相关的知识，希望对你有一定的参考价值。
一、css方式
1.单行文本
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
2.多行文本
p {
position:relative;
overflow:hidden;
}
p:after {
content:"...";
position:absolute;
bottom:0;
right:0;
background:url(http://css88.b0.upaiyun.com/css88/2014/09/ellipsis_bg.png) repeat-y;
}
（需要用 js 处理文本不溢出不出现渐变半透明背景图，即多余省略号）
注：如不考虑文本复制问题，可简单粗暴的使用 js 配合 css 处理 （css：溢出隐藏，js ：文档节点绑定数据 || title 动效）
以上是关于文本溢出显示省略号的主要内容，如果未能解决你的问题，请参考以下文章