导航

萌即是正义!时不时分享一些ACG活动记录与有趣代码的小站!

【CSS】单行文本超过宽度显示省略号的样式

作者:广树·时间:2016-02-15 21:49:02·分类:CSS/HTML

算是比较实用的样式。

这个方法只有在单行的情况下才会奏效,所以在样式写的时候必须要限定只能单行。(比如使用white-space:nowrap;来强制单行)然后加上overflow:hidden; 隐藏溢出。最后加上关键样式text-overflow:ellipsis;即可

样式如下:

div {
	white-space:nowrap; 
	overflow:hidden; 
	text-overflow:ellipsis;
}


效果:

我是一段很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长的例子
侧边栏
最新评论
广树
2024-05-08
@Asuna:谢谢!谢谢!
Asuna
2024-05-08
恭喜获得高质量博客认证~
广树
2024-05-08
@老张博客:是的,不仅仅是大城市,很多小乡村也是依靠动漫发展起来的旅游产业,所以不要小看文化产业带来的经济价值啊!
老张博客
2024-05-08
到日本 是不是大街小巷都是这些动漫呀!
广树
2024-05-08
@Chise Hachiroku:不是还有,而是最近出来的新服务🤭。送货时间太迟了,不是急需的话还是一般配送比较好。
正在攻略

圣兽之王.jpg

传颂之物

PSN奖杯卡

PSN奖杯卡

赞助商广告