简介: <!DOCTYPE html> <html> <head>     <title>纯css实现左

移动端 纯CSS实现左右滚动代码 适用IOS苹果系统 第1张

<!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>

本文标签: 移动端   滚动代码   苹果系统  

温馨提示:本文是作者 爱站云 的原创文章,转载请注明出处和附带本文链接!

相关文章

网友点评

您好,请先 QQ登录 后进行评论,如您已登录账户,请点击 刷新页面 再进行评论!

爱站云

爱站云

www.aizhancloud.com

爱站云(AiZhanCloud.Com)提供zblog、emlog、discuz网站问题、修复、解决、仿站以及出售国内/海外云服务器等服务!

Powered By Z-BlogPHP Theme By 爱站云

sitemapsitemaps网站地图 | 鲁ICP备18014478号-8

免责声明:本博客所展示内容均为互联网技术教程分享,如有侵权等违规信息请联系QQ客服进行删除处理,谢谢配合!