首页 > 代码库 > css隐藏多余文字显示...

css隐藏多余文字显示...

<style>.ellipsis{width:100px; overflow:hidden; text-overflow:ellipsis; white-space: nowrap;}.ellipsis:hover{overflow: visible;}</style><div class="ellipsis">css隐藏多余文字并用...表示未完的内容</div>

 

使用到的css属性

width:***, overflow:hidden, text-overflow:ellipsis多余的文字用...显示。, white-space:nowrap保持文字在一行显示不折行

text-overflow:clip | ellipsis;

  clip:修剪文本。

  ellipsis:显示省略符号来代表被修剪的文本。

 

css隐藏多余文字显示...