div文字超出使用css限制宽度,用省略号…

2018-10-1109:33:31网页制作Comments16,268 views字数 471阅读模式

做前端的时候总是遇到文字超出的问题,那么可以使用div可以限制宽度,超出部分用省略号文章源自菜鸟学院-https://www.cainiaoxueyuan.com/zhizuo/6526.html

  1. <style>
  2. div.wid{
  3. width:200px;
  4. white-space:nowrap;
  5. text-overflow:ellipsis;
  6. -o-text-overflow:ellipsis;
  7. overflow: hidden;
  8. }
  9. </style>
  10. <div class=>这是很长的一段文字,这是很长的一段文字,这是很长的一段文字</div>

但这种做法无法做到两行后,超出部分用省略号。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/zhizuo/6526.html

后来换种思路,既然不能在css里面设置,就在文字里面截取字符,然后加上“…”文章源自菜鸟学院-https://www.cainiaoxueyuan.com/zhizuo/6526.html

我是用struts标签做的文章源自菜鸟学院-https://www.cainiaoxueyuan.com/zhizuo/6526.html

  1. <s:if test="detail.length() > 20">
  2. <s:property value="detail.substring(0, 20)" />...
  3. </s:if>
  4. <s:else>
  5. <s:property value="detail" />...
  6. </s:else>

一开始还不知道struts标签可以用java语法。试了一下,还真可以,完成任务还得到意外收获,开心.O(∩_∩)O~~文章源自菜鸟学院-https://www.cainiaoxueyuan.com/zhizuo/6526.html

  • 本站内容整理自互联网,仅提供信息存储空间服务,以方便学习之用。如对文章、图片、字体等版权有疑问,请在下方留言,管理员看到后,将第一时间进行处理。
  • 转载请务必保留本文链接:https://www.cainiaoxueyuan.com/zhizuo/6526.html

Comment

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定