当前位置: 首页 > Web前端 > HTML5

input实现文本超省略号功能

时间:2023-04-05 22:42:41 HTML5

input实现文本省略号功能对于普通元素实现文本超宽自动变成省略号很简单,给元素加个宽度,然后加上这些三个CSS:空白:nowrap;文本溢出:省略号;溢出:隐藏;你有没有想过将这种效果添加到input="text"元素中?如图:input实现了文本超出省略号的功能当文字超出宽度时,会自动变成省略号

其实让input实现文本超出自动改成省略号,还是三段代码,很简单。经测试,目前(2018-11-23)只有最新的Chrome和Firefox浏览器支持,移动端未测试!