版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/jnshu_it/article/details/85334830
如何使空间不足导致文字隐藏时会出现小点
详细描述
空间不足导致文字隐藏,隐藏的文字会用小点替代
代码
time {
width: 3rem;
height: .2rem;
padding-left: .3rem;
line-height: .2rem;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
font-size: .1rem; }
重点就是这段代码
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
北京分院|内门弟子] JS-郭晨阳
text-overflow:ellipsis;要达到的效果是:文字超出容器宽度时,文字被隐藏的文字用省略号代替。所以该属性只能用于块状元素或行内块元素中,对行内元素是不起作用的。行内元素要显示省略号,需要先转化成块状元素或行内块元素。
一般和white-space:noworp;(强制文字不换行),overflow:hidden;(文字溢出隐藏),一起使用。