1. 内容横向滚动的代码
.ul { display: box; display: -webkit-box; width: 250px; background: yellow; overflow-y: hidden; overflow-x:auto; } .li { flex-shrink:0; -webkit-flex-shrink: 0; width: 100px; height: 50px; background: red; margin-right: 5px; }
<div class="ul"> <div class="li">1</div> <div class="li">2</div> <div class="li">3</div> <div class="li">4</div> <div class="li">5</div> </div>
2. 避免浏览器自动压缩空格问题。
有时在显示内容,文本中有多个空格相连,但是浏览器会自动压缩空格,这样就让多个空格看起来像一个空格。
方法1:
替换空格字符为 ,但是这种方法在英文文本的断词上会出问题,会无法很好的断词换行,所以并不是很好。
方法2:
既然浏览器会压缩多个空格,那只要保证文本里每次只有一个空格相邻就可以了。
□ -> □
□□ -> □
□□□ -> □ □
□□□□ -> □ □
text = text.replace(/[ ]{2}/g, ' ');
本文转自 海角在眼前 博客园博客,原文链接:http://www.cnblogs.com/lovesong/p/5548691.html ,如需转载请自行联系原作者