zoukankan      html  css  js  c++  java
  • 移动端左右滑动问题-html与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{

                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>

     

  • 相关阅读:
    pageX,clientX,screenX,offsetX的区别
    不同的浏览器内核了解学习
    小游戏模仿
    浏览器兼容性
    hack是什么
    DOM对象
    Browser对象
    html状态码与缓存学习
    javascript对象(2)
    javascript对象(1)
  • 原文地址:https://www.cnblogs.com/ranyonsue/p/10709696.html
Copyright © 2011-2022 走看看