css实现滑动操作CSS 滑动操作的原理与轮播图原理类似:
⼦盒⼦宽度或者⾼度超出⽗盒⼦宽度或者⾼度,隐藏滚动条,就可以实现滑动操作:html 结构如下:
<div class="box">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
css去掉滚动条<li></li>
<li></li>
</ul>
</div>
CSS 代码如下:
* {
padding: 0;
margin: 0;
}
.box {
width: 500px;
border: 1px solid black;
height: 100px;
overflow: scroll;
}
.box::-webkit-scrollbar {
display: none;
}
ul {
list-style: none;
width: 800px;
}
li {
width: 100px;
height: 100px;
background-color:red;
border: 1px solid black;
float: left;
}
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论