css怎么设置溢出不换行-木庄网络博客

2022-04-04 05:33:57 PHP中文网 JavaScript 百度已收录

本文摘自PHP中文网，作者藏色散人，侵删。

css设置溢出不换行的方法：首先创建一个HTML示例文件；然后定义div；最后通过设置“overflow: hidden;text-overflow:ellipsis;”等css样式实现溢出不换行效果即可。

本文操作环境：windows7系统、HTML5&&CSS3版、Dell G3电脑。

css文本溢出不换行，省略号显示

单行文本溢出；

设置宽度，多于文本溢出，显示省略号；

div{
width:300px;    
overflow: hidden;    
text-overflow:ellipsis;    
whitewhite-space: nowrap;
}

多行文本溢出；

相关阅读 >>

更多相关阅读请进入《css》频道 >>

书籍

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

￥83.86元 人民邮电出版社

本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者