html横向滑动案例

<style type="text/css">
        .outer-container,.content {width: 630px; height: 185px;padding-left: 8px;}
        .outer-container {overflow: hidden;width: 100%;}
        .inner-container {overflow:scroll;}
        .inner-container::-webkit-scrollbar {display: none;}
        .swiper-box{display: inline;margin-right: 8px;}
        .swiper-box img{height: 165px;}
    </style>
     <div class="outer-container">
         <div class="inner-container">
            <div class="content">
                <div class="swiper-box" data-id='3'>
                      <img src="../img/ios/taocan1.png">
                  </div>
                  <div class="swiper-box" data-id='3'>
                      <img src="../img/ios/taocan2.png">
                  </div>
                  <div class="swiper-box" data-id='3'>
                      <img src="../img/ios/taocan3.png">
                  </div>
                  <div class="swiper-box" data-id='3'>
                      <img src="../img/ios/taocan4.png">
                  </div>
            </div>
         </div>
     </div>

  

 

posted @ 2018-07-25 12:16  scott_j  阅读(1220)  评论(0编辑  收藏  举报