移动端使用CSS如何实现左右滑动的示例
<!DOCTYPE html> <html> <head> <title>纯css实现左右滑动</title> <style type="text/css"> ul,li{ list-style: none;; } .slide-box{ margin-top:200px; display: -webkit-box; overflow-x: auto; /*适应苹果*/ -webkit-overflow-scrolling:touch; } .slide-item{ width: 300px; height: 300px; border:1px solid #ccc; margin-right: 30px; background: pink; } /*隐藏掉滚动条*/ .slide-box::-webkit-scrollbar { display: none; } </style> </head> <body> <ul class="slide-box"> <li class="slide-item"></li> <li class="slide-item"></li> <li class="slide-item"></li> <li class="slide-item"></li> <li class="slide-item"></li> </ul> </body> </html>
以上是移动端使用CSS如何实现左右滑动的示例的详细内容。更多信息请关注PHP中文网其他相关文章!