Home  >  Article  >  Web Front-end  >  CSS文字超出div或者span时显示省略号_html/css_WEB-ITnose

CSS文字超出div或者span时显示省略号_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:29:031844browse

我们常常需要在文本过长时显示,将超出显示成省略号:

思想为:

首先设置宽度,然后让超出的部分隐藏
如果有超出则在最后显示省略号
让文本不换行

具体css代码为:

.title{

width:200px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
word-break:keep-all;

}

Html代码就不用写了,一个div 或者span class = "title"即可。

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn