资讯动态

文字溢出显示省略号效果

发布时间:2026/8/30 15:02:34 来源:尧图企业网站定制
!DOCTYPE html html head meta charsetutf-8 title溢出显示点点点/title style typetext/css .dv{ width:300px; height:150px; padding: 10px; border: 1px solid #ccc; /* 强制不换行 */ white-space: nowrap; /* 文字的超出部分用省略号代替 */ text-overflow: ellipsis; /* 隐藏溢出内容 */ overflow: hidden; } /style /head body div classdv 这是一段超长的文字超长的文字 这是一段超长的文字真的超长超长超长 的。这是一段超长的文字超长的文字 这是一段超长的文字真的超长超长超 长的。 /div /body /html一段很长文字在页面缩放显示的时候会溢出很多时候都是设置为溢出显示点点点。如果一段文字想要设置两行显示超出部分点点点代码如下display: -webkit-box; word-break: break-all; text-overflow: ellipsis; overflow: hidden; white-space: pre-line; -webkit-box-orient: vertical; -webkit-line-clamp: 2;

读完文章,也想定制专属网站?

尧图设计师 24 小时内与您沟通定制方案

免费获取报价