大家好，欢迎来到IT知识分享网。
在编写自定义插件my-slider的过程中，发现无论float还是inline-block均不能保证div内的内容不换行（这两个属性在内容超出容器尺寸后，均将剩余内容做换行处理），在浏览器内比较了自己定义的my-slider-item和mui框架定义的mui-slider-item，发现其用了：white-space:nowrap属性，在MDN、w3cshool里分别查阅了该属性，描述如下：
MDN：
w3school：
即：对父级元素应用了nowrap属性后，其内部的内联元素、字符、果冻元素会保持在一行（不换行），直到遇到<br>换行符。
综上，当我们希望块内的元素一直水平排列不换行（如想做横向滚动效果），处理思路就是：
1. 将块级元素降级为果冻元素、行内元素
2. 对果冻元素、行内元素应用white-space:nowrap样式
.my-slider-group{ overflow: hidden; white-space: nowrap; } .my-slider-group .my-silder-item{ display: inline-block; width:100%; }
end…
免责声明：本站所有文章内容,图片，视频等均是来源于用户投稿和互联网及文摘转载整编而成，不代表本站观点，不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益，请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权，请联系删除，如若转载，请注明出处：https://yundeesoft.com/32527.html
