SuperSlide实现商品列表滚动效果代码

代码语言:html

所属分类:幻灯片

代码描述:SuperSlide实现商品列表滚动效果代码

代码标签: 列表 滚动 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<html>
<head>



    <meta charset="UTF-8">
    <title>新品展示</title>
<style>
    *{margin: 0;padding: 0;font-family: "微软雅黑";font-weight: normal;list-style:none;font-style:normal;text-decoration:none}
.container{width: 1200px;margin: 0 auto;}
/*新品展示*/
.pro-new{width: 100%;height: 100vh;overflow: hidden;padding: 35px 0 45px 0;background: #f3f1ff;}
.pro-new .title{font-size: 34px;text-align: center;padding-bottom: 5px;color: #333333;letter-spacing: 1px;}
.pro-new .sub-title{font-size: 20px;text-align: center;color: #333333;}
.pro-new .sub-title span{display: inline-block;height: 30px;line-height: 30px;width: auto;}
.pro-new .sub-title span.text{padding: 0 10px;}
.pro-new-show {position: relative;width: 100%;height: auto;overflow: hidden;}
.pro-new-show .pro-list{width: 100%;height: auto;margin-top: 30px;overflow: hidden;}
.pro-new-show .pro-list ul li{float: left;width: 387px;height: auto;overflow: hidden;background: #FFFFFF;margin-right: 19px;}
.pro-new-show .pro-list ul li:last-child{margin-right: 0;}
.pro-new-show .pro-list ul li img{width: 100%;height: 291px;}
.pro-new-show .pro-list ul li .desc{padding: 10px 20px;box-sizing: border-box;}
.pro-new-show .pro-list ul li .desc .p-title{font-size: 16px;color: #323232;padding-bottom: 5px;}
.pro-new-show .pro-list ul li .desc .p-desc{font-size: 14px;color: #969696;line-height: 25px;}
.pro-new-show .arrow a{display: inline-block;position: absolute;width: 49px;height: 100px;z-index: 2;}
.pro-new-show .arrow a.prev{left: 0;top: 50%;margin-top: -100px;background: url(//repo.bfw.wiki/bfwrepo/image/5f7ab7a3a8387.png) center center no-repeat;}
.pro-new-show .arrow a.next{right: 0;top: 50%;margin-top: -100px;background: url(//repo.bfw.wiki/bfwrepo/image/5f7ab7cfd3599.png) center center no-repeat;}
.pro-new-show .arrow a:hover{background-color: rgba(0,0,0,.3);}
.pro-new-show .pagination{position: relative;width: 1.........完整代码请登录后点击上方下载按钮下载查看

网友评论0