是一种常用的文字溢出处理方式,其实它的实现也很简单,只需要使用CSS的两个属性:
overflow和text-overflow
我们需要定义一个容器,将要溢出的文字放入其中:
<div class="container"> 这里是要溢出的文字 </div>
我们就可以使用CSS来实现文本溢出时的省略号显示效果:
.container { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
其中,overflow属性用于指定容器的溢出处理方式,我们将其设置为hidden,表示隐藏超出容器的部分;text-overflow属性用于指定溢出的文本如何显示,我们将其设置为ellipsis,表示用省略号来表示溢出的文本;white-space属性用于指定文本的换行处理方式,我们将其设置为nowrap,表示禁止换行。
我们就可以看到,容器中的文字溢出时会被省略号替代,实现了文本溢出时的省略号显示效果。
本文链接:http://task.lmcjl.com/news/12850.html