CSS处理文本过长或超出部分（解释2）

解释1中的方法不兼容Firefox和IE浏览器，所以解释2会给出一个通用的css写法。原理：有两个框a和b，文本内容放在框b中，框a的高度和行高固定，隐藏a以外的内容，最后放一个省略号，如图下图，红圈部分被省略号覆盖。.a{宽度：300px;/*想显示几行，高度是行高的倍数*/height:52px;行高：26px；溢出：隐藏；边框：1px实心#ddd；}.a::before{浮动：左；宽度：5px；内容：'';}.a::after{高度：26px；内容：”...”;行高：26px；width:3em;/*省略号宽度*/margin-left:-1em;/*在文末制作省略号*/position:relative;顶部：26px；左：100%；背景色：#fff；}.b{浮动：对；左边距：-5px；宽度：100%；行高：26px；分词：break-all；}在web开发中，经常会遇到文字超出限制范围的情况，尤其是屏幕尺寸造成的，确实很影响美观。这时候就需要用css来处理了。下面的方法是我在实际工作中总结出来的，供大家参考。