对于文字溢出的解决,若是PC端还好控制,但是在手机端的控制就比较复杂了。
曾尝试用百分比设定宽度,可是却总会撑开,出现滚动条。而尝试用em值,不同手机浏览器的显示效果又不同,切距离看起来会拉的很大。
最后的解决办法:
用jQuery,动态获取屏幕的宽度,然后再按百分比赋值给需要控制溢出的类。最后还不能忘了,溢出超过显示省略号的三个属性,将这个属性所归的类名添加给需要控制的类。这样不管屏幕大小怎么变。每刷新一次就能实现想要的效果。
另外,想要实现页面跳转,不一定要用a标签,用这个即可,
<li onClick=“ location=‘detail.html‘ "></li>
或者<li onclick="window.location=‘detail.html‘ "></li>
PC端文字溢出控制显示省略号:
overflow:hidden; white-space:nowrap; text-overflow:ellipsis;
时间: 2024-08-09 14:46:14