今天在写样式的时候突然需要实现样式css溢出隐藏并显示省略号.话不多说.

单行文本溢出隐藏样式css如下
overflow: hidden;

单行文本溢出隐藏显示省略号样式css如下
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

多行文本溢出隐藏显示省略号样式css如下
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;

多行文本溢出隐藏时,-webkit-line-clamp: 3; 把3改成几就显示几行。

鼠标悬停显示全部文字:

在标签内添加对应要显示的属性title="鼠标悬停显示的文字"即可

大概就是这样了.

以上就是【css溢出隐藏并显示省略号,鼠标悬停显示全部文字】的全部内容了,欢迎留言评论进行交流!

赞(0) 踩(0)

与本文相关的软件

发表我的评论

最新评论

  1. 暂无评论