我是靠谱客的博主 闪闪巨人,最近开发中收集的这篇文章主要介绍仿照苏宁易购的简单网站制作(包含效果图及其代码),觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

 

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>苏宁易购</title>
</head>
<style>
    @font-face {
        font-family: 'ng-iconfont';
        src: url('fonts/iconfont.eot?var=06');
        src: url('fonts/iconfont.eot?#iefix06') format('embedded-opentype'), url('fonts/iconfont.woff?var=06') format('woff'), url('fonts/iconfont.ttf?var=06') format('truetype'), url('fonts/iconfont.svg#uxiconfont?var=06') format('svg');
        font-weight: normal;
        font-style: normal;
        font-display: block;
    }
    
    * {
        padding: 0;
        margin: 0;
    }
    
    .w {
        width: 1190px;
        margin: auto;
    }
    
    li {
        list-style: none;
    }
    
    .top {
        padding: 0px 1px;
        background-color: #82f8de;
        text-align: center;
    }
    
    .top2 {
        height: 35px;
        background-color: #f5f5f5;
        z-index: 7690;
    }
    
    .t-left {
        height: 35px;
        float: left;
    }
    
    .iconfont-xia {
        font-family: 'ng-iconfont';
        font-style: normal;
        display: inline-block;
        font-size: 10px;
    }
    
    .wang {
        float: left;
        display: block;
    }
    
    .wang span {
        position: relative;
        float: left;
        padding: 0 10px;
        line-height: 35px;
        height: 35px;
        color: #666;
        font-size: 12px;
        text-decoration: none;
    }
    
    .wangzhan {
        display: none;
        position: absolute;
        top: 140px;
        width: 988px;
        border: 1px solid #ddd;
        background-color: #fff;
        padding: 20px 0;
        left: auto;
        z-index: 7691;
    }
    
    .wang:hover .wangzhan {
        display: block;
    }
    
    .list {
        width: 176px;
        border-right: 1px solid #eee;
        padding-left: 20px;
        float: left;
    }
    
    .wangzhan .list dt {
        height: 25px;
        width: 100%;
        font-size: 14px;
        line-height: 17px;
        font-family: "Microsoft Yahei";
    }
    
    .t-left .list dd {
        width: 100%;
        overflow: hidden;
    }
    
    .t-left .list dd p {
        float: left;
        height: 25px;
        width: 78px;
        line-height: 25px;
    }
    
    .t-left .list dd p a {
        font-size: 12px;
        display: inline-block;
        position: relative;
        padding: 0;
        color: #666;
        text-decoration: none;
    }
    
    .t-left .list dd p a:hover {
        color: #f60;
    }
    
    .wangzhan .hot {
        position: absolute;
        display: inline-block;
        height: 16px;
        width: 16px;
        background-image: url(npbg.png);
        background-position: 0 -205px;
        background-repeat: no-repeat;
    }
    
    .w2 dl dd p {
        display: inline-block;
        text-decoration: none;
        height: 25px;
        width: 78px;
        line-height: 25px
    }
    
    .shangjiamen {
        display: none;
        position: absolute;
        top: 140px;
        border: 1px solid #ddd;
        background-color: #fff;
        left: 60;
        right: auto;
        width: 162px;
        padding-top: 5px;
        padding-bottom: 5px;
        z-index: 7691;
    }
    
    .wang:hover .shangjiamen {
        display: block;
    }
    
    .list-shangjia {
        width: 176px;
        padding-left: 10px;
        float: left;
    }
    
    .t-left .list-shangjia dd {
        width: 100%;
        overflow: hidden;
    }
    
    .t-left .list-shangjia dd p {
        float: left;
        height: 25px;
        width: 78px;
        line-height: 25px;
    }
    
    .t-left .list-shangjia dd p a {
        font-size: 12px;
        display: inline-block;
        position: relative;
        padding: 0;
        color: #666;
        text-decoration: none;
    }
    
    .t-left .list-shangjia dd p a:hover {
        color: #f60;
    }
    
    .kehufuwu {
        display: none;
        position: absolute;
        top: 140px;
        border: 1px solid #ddd;
        background-color: #fff;
        left: auto;
        right: 85;
        width: 162px;
        padding-top: 5px;
        padding-bottom: 5px;
        z-index: 7691;
    }
    
    .wang:hover .kehufuwu {
        display: block;
    }
    
    .wang .kehufuwu a {
        display: block;
        width: 71px;
        height: 28px;
        padding: 0;
        float: left;
        line-height: 28px;
        font-size: 12px;
        text-decoration: none;
        padding-left: 10px;
        color: #666
    }
    
    .wang.kehufuwu a:hover {
        color: #f60;
    }
    
    .kehufuwu .zixun {
        font-family: 'ng-iconfont';
        font-style: normal;
        font-size: 16px;
        line-height: 27px;
        color: #ffd200;
    }
    
    .t-right {
        height: 35px;
        float: right;
    }
    
    .qing a {
        display: block;
        position: relative;
        float: left;
        padding: 0 10px;
        line-height: 35px;
        height: 35px;
        overflow: hidden;
        color: #666;
        font-size: 12px;
        text-decoration: none;
    }
    
    .qing {
        float: left;
    }
    
    .dingdanmen {
        display: none;
        position: absolute;
        top: 140px;
        border: 1px solid #ddd;
        background-color: #fff;
        left: 100;
        width: 81px;
        padding-bottom: 5px;
        z-index: 7691;
    }
    
    .dingdanmen a {
        display: block;
        height: 30px;
        width: 71px;
        line-height: 30px;
        padding-left: 10px;
        text-decoration: none;
    }
    
    .dingdanmen span {
        font-size: 12px;
    }
    
    .dingdanmen span:hover {
        color: #f60;
    }
    /* .dingdan:hover .wddd {
        color: #666;
        line-height: 33px;
        height: 35px;
        padding: 0 9px;
        background-color: #fff;
        border: 1px solid #ddd;
        cursor: default;
    } */
    /* .dingdan .wddd:hover span {
        color: #f60;
        cursor: default;
    } */
    
    .dingdan:hover .dingdanmen {
        display: block;
    }
    
    .ss {
        float: left;
    }
    
    .ss a {
        display: block;
        position: relative;
        float: left;
        padding: 0 10px;
        line-height: 35px;
        height: 35px;
        overflow: hidden;
        color: #666;
        font-size: 12px;
        text-decoration: none;
    }
    
    .gouwuche {
        float: left;
    }
    
    .gouwuche span {
        display: block;
        position: relative;
        float: left;
        padding: 0 10px;
        line-height: 35px;
        height: 35px;
        overflow: hidden;
        color: #666;
        font-size: 12px;
        text-decoration: none;
    }
    
    .dingdan {
        float: left;
    }
    
    .dingdan span {
        display: block;
        position: relative;
        float: left;
        padding: 0 10px;
        line-height: 35px;
        height: 35px;
        overflow: hidden;
        color: #666;
        font-size: 12px;
        text-decoration: none;
    }
    
    .wodeyigou {
        float: left;
    }
    
    .wodeyigou span {
        display: block;
        position: relative;
        float: left;
        padding: 0 10px;
        line-height: 35px;
        height: 35px;
        overflow: hidden;
        color: #666;
        font-size: 12px;
        text-decoration: none;
    }
    
    .yigoumen {
        display: none;
        border: 1px solid #ddd;
        background-color: #fff;
        width: 203px;
        z-index: 7691;
        position: absolute;
        top: 140px;
    }
    
    .yigoumen a {
        display: block;
        position: relative;
        float: left;
        padding: 0 10px;
        line-height: 35px;
        height: 35px;
        overflow: hidden;
        color: #666;
        font-size: 12px;
        text-decoration: none;
    }
    
    .yigou i {
        font-family: 'ng-iconfont';
        font-style: normal;
        display: inline-block;
        font-size: 10px;
    }
    
    .yigoumen span {
        font-size: 12px;
    }
    
    .yigoumen span :hover {
        color: #f60;
    }
    
    .denglu img {
        width: 50px;
        height: 50px;
    }
    
    .wodeyigou:hover .yigoumen {
        display: block;
    }
    
    .top3 {
        width: 100%;
        height: 110px;
        z-index: 7681;
    }
    
    .kong {
        height: 100px;
        margin: 0 auto;
        width: 1190px;
    }
    
    .suning {
        float: left;
        margin-top: 10px;
    }
    
    .suning img {
        height: 90px;
        width: 190px;
    }
    
    .zhong {
        position: relative;
        width: 600px;
        height: 100px;
        float: left;
        margin-left: 120px;
        z-index: 7683;
    }
    
    .search {
        position: relative;
        margin-left: 60px;
        width: 540px;
        margin-top: 30px;
    }
    
    .ii {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 25px;
        height: 40px;
        line-height: 40px;
        line-height: 42px;
        text-align: right;
        font-size: 14px;
        color: #ccc;
    }
    
    .e1 {
        margin-right: 0;
        float: left;
        width: 372px;
        padding: 0 0 0 28px;
        border: 2px solid #ff8000;
        border-radius: 12px 0 0 12px;
        position: relative;
    }
    
    .e3 {
        width: 390px;
        padding: 9px 10px 9px 0;
        height: 18px;
        line-height: 18px;
        margin-top: 0;
        border: 0;
        background: #FFF;
        color: #BBB;
        font-size: 12px;
        font-family: 'MicroSoft YaHei';
        /* border: 2px solid #ff8000;
        border-radius: 12px 0 0 12px; */
        border-radius: 0;
    }
    
    .e2 {
        float: left;
        position: relative;
        right: 0;
        height: 100%;
    }
    
    .e4 {
        height: 100%;
        width: 120px;
        background: #ff8000;
        border-radius: 0;
        border-top-right-radius: 12px;
        border-bottom-right-radius: 12px;
        font-size: 18px;
        height: 40px;
        padding: 0;
        font-family: 'MicroSoft YaHei';
        font-weight: bold;
        letter-spacing: 2px;
        text-indent: 2px;
        color: #FFF;
        border: 0;
        cursor: pointer;
    }
    
    .wenzi {
        float: left;
        width: 100%;
        height: 18px;
        margin-top: 5px;
    }
    
    .a2 {
        float: left;
        white-space: nowrap;
        font-size: 12px;
        margin: 3px 0 3px -11px;
        padding: 0 20px 0 10px;
        border-left: 1px solid #ddd;
        height: 12px;
        line-height: 12px;
        color: #999;
    }
    
    .a1 {
        float: left;
        white-space: nowrap;
        font-size: 12px;
        margin: 3px 0 3px -11px;
        padding: 0 20px 0 10px;
        border-left: 1px solid #ddd;
        height: 12px;
        line-height: 12px;
        color: #FF6600;
    }
    
    .fenlei {
        position: relative;
        width: 100%;
        min-width: 990px;
        overflow: visible;
        height: 38px;
        z-index: 7670;
    }
    
    .f1 {
        float: left;
    }
    
    .f2 {
        float: left;
    }
    
    .f3 {
        float: right;
    }
    
    .dt {
        width: 166px;
        padding-left: 34px;
        display: block;
        height: 38px;
        top: 0;
        line-height: 38px;
        background: #ff8000;
        color: #fff;
        font-size: 13px;
        font-weight: bold;
        border-radius: 12px 12px 0 0;
        text-decoration: none;
    }
    
    .f2 img {
        width: 100%;
        height: 38px;
    }
    
    .f2 ul li {
        float: left;
        height: 38px;
        padding: 0 12px 0 13px;
        font-weight: bold;
    }
    
    .f2 ul li a {
        color: #333;
        font-size: 15px;
        font-family: 'Microsoft Yahei', tahoma, arial, 'Hiragino Sans GB';
        line-height: 38px;
        text-decoration: none;
    }
    
    .f3 .gongshi img {
        width: 196px;
        height: 39px;
    }
    
    .main {
        margin-left: 200px;
    }
    
    .A img {
        width: 50px;
        height: 50px;
    }
    
    .A a {
        float: left;
    }
    
    .A {
        margin-top: 5px;
        margin-left: 10px;
        height: 60px;
    }
    
    .AA {
        float: left;
        margin-left: 10px;
    }
    
    .AA p {
        margin-top: 6px;
        font-size: 12px;
        color: #333;
    }
    
    .AA a {
        text-decoration: none;
        margin-top: 10px;
        font-size: 12px;
        color: #333;
    }
    
    .B {
        height: 80px;
    }
    
    .new {
        color: #fff;
        margin-top: 10px;
        background: #ff8000;
        display: block;
        width: 156px;
        height: 24px;
        border-radius: 3px;
        text-align: center;
        line-height: 24px;
        margin-left: 20px;
        text-decoration: none;
        font-size: 10px;
    }
    
    .super {
        text-decoration: none;
        color: #fada99;
        margin-top: 10px;
        background-image: linear-gradient(-90deg, #373a77 3%, #17125b 100%);
        display: block;
        width: 156px;
        height: 24px;
        border-radius: 3px;
        text-align: center;
        line-height: 24px;
        margin-left: 20px;
        font-size: 10px;
    }
    
    .C {
        height: 90px;
    }
    
    .C a {
        float: left;
        width: 65px;
        height: 85px;
        text-decoration: none;
        text-align: center;
    }
    
    .C a img {
        display: block;
        width: 36px;
        height: 36px;
        margin: 6px auto;
    }
    
    .D {
        height: 250px;
        width: 196px;
        border-top: 1px solid #f2f2f2;
    }
    
    .D ul {
        width: 210px;
    }
    
    .D ul li {
        float: left;
        width: 65px;
        height: 85px;
        border-width: 0 1px 1px 0;
        border-style: solid;
        border-color: #f2f2f2;
        text-align: center;
    }
    
    .D ul li img {
        display: block;
        width: 26px;
        height: 26px;
        margin: 12px 20px;
    }
    
    .banner {
        position: relative;
        width: 100%;
        height: 530px;
        /* background-color: rgb(0, 168, 255); */
        z-index: 0;
    }
    
    .main {
        margin-left: 200px;
    }
    
    .g {
        width: 794px;
        float: left;
    }
    
    .g a img {
        height: 400px;
        width: 794px;
    }
    
    .g1 a img {
        float: left;
        width: 194px;
        height: 112px;
        background: #fff;
        margin-left: 2px;
        cursor: default;
        border-radius: 6px;
    }
    
    .daohang {
        float: left;
        width: 200px;
        background-color: white;
        height: 476px;
    }
    
    .hi {
        float: left;
        width: 196px;
        height: 476px;
        background-color: #FFF;
        z-index: 50;
    }
    
    .daohang ul li a {
        text-decoration: none;
        font-size: 14px;
        color: #000;
    }
    
    .daohang ul li a:hover {
        color: #FF6600;
    }
    
    .daohang ul li em {
        font-size: 14px;
        vertical-align: middle;
        height: 12px;
        width: 1px;
        margin: 0 7px
    }
    
    .daohang ul li {
        height: 31px;
        line-height: 31px;
    }
    
    .tu {
        width: 16px;
        height: 16px;
        margin-left: 5px;
        margin-right: 4px;
    }
    
    .list-ll1 {
        display: none;
        position: relative;
        top: -40px;
        left: 200px;
        width: 989px;
        height: 476px;
        background-color: rgb(243, 243, 243);
    }
    
    .list-l li:hover {
        background-color: rgb(243, 243, 243);
    }
    
    .list-l .list-l1:hover .list-ll1 {
        display: block;
    }
    
    .small-top {
        position: relative;
        top: 5px;
        width: 700px;
        height: 24px;
        margin: 10px 0 0 8px;
    }
    
    .list-ll1 .small-top a {
        height: 24px;
        color: #fff;
        font-size: 12px;
        line-height: 24px;
        padding: 0 10px;
        border-radius: 4px;
        margin-left: 24px;
        text-align: center;
        text-decoration: none;
        background-color: rgb(50, 103, 255);
        font-family: 'Microsoft Yahei', tahoma, arial, 'Hiragino Sans GB';
    }
    
    .small-mid {
        width: 780px;
        margin: 10px 0 0 0;
        padding-left: 20px;
    }
    
    .small-mid dl {
        width: 750px;
        height: 57px;
    }
    
    .small-mid .ddl-6,
    .small-mid .ddl-7,
    .small-mid .ddl-8,
    .small-mid .ddl-9 {
        height: 40px;
    }
    
    .small-mid dt {
        width: 84px;
        height: 20px;
        line-height: 20px;
        font-weight: 700;
        padding-top: 8px;
        padding-left: 10px;
    }
    
    .small-mid dt a {
        font-size: 12px;
        display: block;
        width: 84px;
        height: 20px;
        text-decoration: none;
    }
    
    .small-mid dd {
        position: relative;
        top: -30px;
        left: 90px;
        width: 640px;
        line-height: 20px;
        border-bottom: 1px solid #eee;
        margin-top: 8px;
        padding-bottom: 8px;
    }
    
    .small-mid dl dd a {
        font-size: 12px;
        color: #000;
        margin-right: 11px;
        display: inline-block;
        text-decoration: none;
        font-family: 'Microsoft Yahei', tahoma, arial, 'Hiragino Sans GB';
    }
    
    .list-ll2 {
        display: none;
        position: relative;
        top: -40px;
        left: 200px;
        width: 989px;
        height: 476px;
        background-color: rgb(243, 243, 243);
    }
    
    .list-l .list-l2:hover .list-ll2 {
        display: block;
    }
    
    .list-ll2 .small-top a {
        height: 24px;
        color: #fff;
        font-size: 12px;
        line-height: 24px;
        padding: 0 10px;
        border-radius: 4px;
        margin-left: 24px;
        text-align: center;
        text-decoration: none;
        background-color: rgb(153, 51, 255);
        font-family: 'Microsoft Yahei', tahoma, arial, 'Hiragino Sans GB';
    }
    
    .footer {
        height: 98px;
    }
    
    .zhengpin {
        float: left;
        border-bottom: 1px solid #000;
        padding: 12px 0;
    }
    
    .zhengpin li {
        width: 220px;
        height: 52.5px;
        margin: 0 10px 0 0;
        float: left;
    }
    
    .zhengpin li a {
        float: left;
        margin-right: 5px;
    }
    
    .zhengpin li a img {
        width: 48px;
        height: 48px;
    }
    
    .service h4 {
        font-size: 14px;
    }
    
    .service p {
        font-size: 12px;
    }
    
    .center {
        width: 100%;
        background-color: #f2f2f2;
    }
    
    .gc {
        margin: 10px auto 0!important;
        height: 320px;
    }
    
    .h {
        margin-top: 6px;
        float: left;
        width: 570px;
        height: 298px;
        border-radius: 12px;
        background: #fff;
        overflow: hidden;
    }
    
    .h a {
        margin-top: 20px;
        margin-left: 20px;
        display: block;
        width: 106px;
        height: 30px;
    }
    
    .h img {
        width: 106px;
        height: 30px;
    }
    
    .h1 ul li a {
        width: 150px;
        height: 150px;
        margin: 0 10px 10px 10px;
        border-radius: 6px;
    }
    
    .h1 {
        margin-top: 20px;
        width: 570px;
        height: 230px;
    }
    
    .h1 ul li {
        float: left;
    }
    
    .h1 ul li img {
        display: block;
        width: 150px;
        height: 150px;
        margin: 0 10px 10px 10px;
        border-radius: 6px;
    }
    
    .title {
        width: 170px;
        height: 20px;
        color: #333;
        font-size: 14px;
        line-height: 20px;
        overflow: hidden;
        text-align: left;
        word-break: break-all;
        font-weight: normal;
        margin-left: 10px;
    }
    
    .title2 {
        height: 21px;
        margin: 4px 4px 4px 10px;
        overflow: hidden;
    }
    
    .title2 span {
        float: left;
        line-height: 21px;
        color: #f30;
        font-size: 18px;
        font-weight: bold;
    }
    
    .i {
        margin: 6px 10px;
        float: left;
        width: 570px;
        height: 298px;
        border-radius: 12px;
        background: #fff;
        overflow: hidden;
    }
    
    .zx {
        margin: 5px auto 0!important;
        height: 320px;
    }
    
    .j {
        margin-top: 6px;
        float: left;
        width: 570px;
        height: 298px;
        border-radius: 12px;
        background: #fff;
        overflow: hidden;
    }
    
    .j1 {
        text-decoration: none;
        width: 100%;
        height: 60px;
        font-size: 24px;
        color: #000;
        margin-left: 15px;
        font-weight: bold;
    }
    
    .k {
        margin: 6px 10px;
        float: left;
        width: 570px;
        height: 298px;
        border-radius: 12px;
        background: #fff;
        overflow: hidden;
    }
</style>

<body>
    <div class="top">
        <a href="https://cuxiao.suning.com/scms/sxkhjyshc.html?safp=d488778a.homepagev8.126605238622.1&safpn=10001" target="_blank">
            <img src="https://image4.suning.cn/uimg/cms/img/165725046133525929.jpg">
        </a>
    </div>
    <div class="top2">
        <div class="w">
            <div class="t-left">
                <div class="wang">
                    <a href="#" class="nav-neirong" target="_blank">
                        <span>网站导航</span>
                        <i class="iconfont-xia"></i>
                    </a>
                    <div class="wangzhan">
                        <dl class="list">
                            <dt>特色购物</dt>
                            <dd>
                                <p>
                                    <a href="https://10035.suning.com/" target="_blank">苏宁互联</a>
                                </p>
                                <p>
                                    <a href="https://dr.suning.com/" target="_blank">苏宁达人</a>
                                </p>
                                <p>
                                    <a href="https://ka.suning.com/" target="_blank">苏宁卡</a>
                                </p>
                                <p>
                                    <a href="https://g.suning.com/" target="_blank">苏宁国际</a>
                                </p>
                                <p>
                                    <a href="https://hx.suning.com/" target="_blank">以旧换新</a>
                                </p>
                                <p>
                                    <a href="https://quan.suning.com/lq_1.htm#classId=1" target="_blank">领券中心</a>
                                </p>
                                <p>
                                    <a href="https://temai.suning.com/" target="_blank">苏宁Outlets</a>
                                </p>
                                <p>
                                    <a href="https://www.suning.com/daogou/index.html" target="_blank">导购指南</a>
                                </p>
                                <p>
                                    <a href="https://pindao.suning.com/city/zhtsgjsgnew.html" target="_blank">江苏馆</a>
                                </p>
                            </dd>
                        </dl>
                        <dl class="list">
                            <dt>主题频道</dt>
                            <dd>
                                <p>
                                    <a href="https://dianqi.suning.com/" target="_blank">电器城</a>
                                </p>
                                <p>
                                    <a href="https://chaoshi.suning.com/" target="_blank">苏宁超市</a>
                                </p>
                                <p>
                                    <a href="https://shouji.suning.com/" target="_blank">手机</a>
                                </p>
                                <p>
                                    <a href="https://pindao.suning.com/city/diannao.htm?safp=d488778a.homepagev8.sTMJP.14&safpn=10001" target="_blank">电脑</a>
                                </p>
                                <p>
                                    <a href="https://pindao.suning.com/city/jiazhuang.htm?safp=d488778a.homepagev8.sTMJP.15&safpn=10001" target="_blank">家装馆</a>
                                </p>
                            </dd>
                        </dl>
                        <dl class="list">
                            <dt>生活助手</dt>
                            <dd>
                                <p>
                                    <a href="https://10035.suning.com/" target="_blank">零钱宝</a>
                                    <i class="hot"></i>
                                </p>
                                <p>
                                    <a href="https://dr.suning.com/" target="_blank">约服务</a>
                                </p>
                                <p>
                                    <a href="https://ka.suning.com/" target="_blank">保险</a>
                                </p>
                            </dd>
                        </dl>
                        <dl class="list">
                            <dt>会员服务</dt>
                            <dd>
                                <p>
                                    <a href="https://vip.suning.com/?safp=d488778a.homepagev8.sTMJP.19&safpn=10001" target="_blank">会员联盟</a>
                                    <i class="hot"></i>
                                </p>
                                <p>
                                    <a href="https://ewsfspc.suning.com/extendIns/index.htm" target="_blank">延长保修</a>
                                </p>
                                <p>
                                    <a href="https://pay.suning.com/epp-epw/login/login.action?res_message=NOT_LOGIN&res_code=4" target="_blank">易付宝</a>
                                </p>
                                <p>
                                    <a href="https://licai.suning.com/lcportal/licaiIndex.htm?res_message=NOT_LOGIN&res_code=4" target="_blank">苏宁理财</a>
                                </p>
                                <p>
                                    <a href="https://jinrong.suning.com/?safp=d488778a.homepagev8.sTMJP.23&safpn=10001" target="_blank">苏宁金融</a>
                                </p>
                            </dd>
                        </dl>
                        <dl class="list">
                            <dt>更多热点</dt>
                            <dd>
                                <p>
                                    <a href="https://www.pptv.com/" target="_blank">PP视频</a>
                                </p>
                                <p>
                                    <a href="https://cc.suning.com/" target="_blank">合作招商</a>
                                    <i class="hot"></i>
                                </p>
                                <p>
                                    <a href="https://union.suning.com/" target="_blank">苏宁联盟</a>
                                </p>
                                <p>
                                    <a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Fueip.suning.com%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Fueip.suning.com%252Fpc%252Findex.htm&multipleActive=false" target="_blank">用户体验</a>
                                </p>
                                <p>
                                    <a href="https://gongyi.suning.com/" target="_blank">苏宁公益</a>
                                    <i class="hot"></i>
                                </p>
                                <p>
                                    <a href="https://snyh.suning.com/" target="_blank">苏宁有货</a>
                                </p>
                            </dd>
                        </dl>
                    </div>
                </div>
                <div class="wang">
                    <a href="https://sop.suning.com/" class="nav-neirong" target="_blank">
                        <span>商家入驻</span>
                        <i class="iconfont-xia "></i>
                    </a>
                    <div class="shangjiamen">
                        <dl class="list-shangjia">
                            <dd>
                                <p>
                                    <a href="https://10035.suning.com/" target="_blank">合作招商</a>
                                </p>
                                <p>
                                    <a href="https://dr.suning.com/" target="_blank">服务市场</a>
                                </p>
                                <p>
                                    <a href="https://ka.suning.com/" target="_blank">金融中心</a>
                                </p>
                                <p>
                                    <a href="https://g.suning.com/" target="_blank">易通天下</a>
                                </p>
                                <p>
                                    <a href="https://hx.suning.com/" target="_blank">规则中心</a>
                                </p>
                                <p>
                                    <a href="https://quan.suning.com/lq_1.htm#classId=1" target="_blank">规则众议院</a>
                                </p>
                            </dd>
                        </dl>
                    </div>
                </div>
                <div class="wang">
                    <a href="" class="nav-neirong" target="_blank">
                        <span>客户服务</span>
                        <i class="iconfont-xia "></i>
                    </a>
                    <div class="kehufuwu">
                        <a href="https://pindao.suning.com/city/bangke.html?safp=d488778a.homepagev8.Fgfr4.2&safpn=10001" target="_blank">苏宁帮客</a>
                        <a href="https://hc.suning.com/help/home.htm" target="_blank">帮助中心</a>
                        <a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Fsnasss.suning.com%2Fsnass-web%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Fsnasss.suning.com%252Fsnass-web%252Fpc%252FreturnGoods%252FtoAfterSaleApplyList.do&loginTheme=b2c&multipleActive=false"
                            target="_blank">退还/维修</a>
                        <a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Fueip.suning.com%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Fueip.suning.com%252Fpc%252Findex.htm&multipleActive=false" target="_blank">意见反馈</a>
                        <a href="https://cuxiao.suning.com/serve.html?safp=d488778a.homepagev8.Fgfr4.6&safpn=10001" target="_blank">30天包退</a>
                        <a href="https://hc.suning.com/serviceSummary/getBannerListPC.htm" target="_blank">省心购</a>
                        <a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Fassss.suning.com%2Fassss-web%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Fassss.suning.com%252Fassss-web%252Fpc%252FtelephoneCustomer%252Fhome.do%253Fsafpn%253D10001&loginTheme=b2c&multipleActive=false"
                            target="_blank">电话客服</a>
                        <a href="https://yxchat.suning.com/index.html?bizCode=005A010101000000&custNo=&bizSeq=005A" target="_blank">
                            <span>在线咨询</span>
                            <i class="zixun"></i>
                        </a>
                    </div>
                </div>
                <div class="wang">
                    <a class="w1" href="#">
                        <span>网页无障碍</span>
                        <em></em>
                    </a>
                </div>
                <div class="wang">
                    <a class="w1" href="#">
                        <span>日照</span>
                    </a>

                </div>
            </div>
            <div class="t-right">
                <div class="qing ">
                    <a href="#">请登录</a>
                    <a href="#">注册有礼</a>
                </div>
                <div class="dingdan">
                    <a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Forder.suning.com%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Forder.suning.com%252Forder%252ForderList.do&loginTheme=b2c&multipleActive=false" class="wddd">
                        <span>我的订单</span>
                        <i class="iconfont-xia tub-dingdan"></i>
                    </a>
                    <div class="dingdanmen">
                        <a href="#">
                            <span>待支付</span>
                        </a>
                        <a href="#">
                            <span>待收货</span>
                        </a>
                        <a href="#">
                            <span>
                                待评价
                            </span>
                        </a>
                        <a href="#">
                            <span>修改订单</span>
                        </a>
                    </div>
                </div>
                <div class="wodeyigou">
                    <a href="#" class="yigou">
                        <span>我的易购</span>
                        <i class="iconfont-xia tub-dingdan"></i>
                    </a>
                    <div class="yigoumen">
                        <div class="denglu">
                            <a href="#" class="img-denglu">
                                <img src="Snipaste_2022-07-12_13-43-33.png">
                            </a>
                            <div class="nei-denglu">
                                <a href="#" class="dl">请登录</a>
                            </div>
                        </div>
                        <a href="#" target="_blank" class="dls">我的消息</a>
                        <a href="#" target="_blank" class="dls dls1">我的关注</a>
                        <a href="https://passport.suning.com/ids/trustLogin?sysCode=epp&targetUrl=http://my.jr.suning.com/sfp/accountAssets/index.htm" target="_blank" class="dls">我的金融</a>
                        <a href="#" target="_blank" class="dls dls1">苏宁会员</a>
                        <a href="https://rxf.suning.com/epps-cpf/accountMgt/assetOverview.do" target="_blank" class="dls">我的任性付</a>
                        <a href="#" target="_blank" class="dls dls2">我的优惠券</a>
                    </div>
                </div>
                <div class="ss">
                    <a href="">苏宁会员</a>
                </div>
                <div class="gouwuche">
                    <a href="">
                        <span>购物车</span>
                    </a>
                </div>
                <div class="ss">
                    <a href="">易付宝</a>
                </div>
                <div class="ss">
                    <a href="">企业采购</a>
                </div>
                <div class="ss">
                    <a href="">手机苏宁</a>
                </div>
            </div>
        </div>
    </div>
    <div class="top3">
        <div class="kong">
            <div class="suning">
                <a href="https://www.suning.com/?safp=d488778a.homepagev8.126605238624.1&safpn=10001" target="_blank">
                    <img src="https://image1.suning.cn/uimg/cms/img/159642507148437980.png">
                </a>
            </div>
            <div class="zhong">
                <div class="search">
                    <i class="ii"></i>
                    <span class="e1"><input class="e3" type="text" >
    
                    </span>
                    <span class="e2"> <input class="e4"type="submit" value="搜索"></span>
                    <div class="wenzi">
                        <a class="a2">手机</a>
                        <a class="a1">爆款洗衣机</a>
                        <a class="a2">冰箱</a>
                        <a class="a1">奶粉特惠购</a>
                        <a class="a1">品质家具购</a>
                        <a class="a2">电视</a>
                        <a class="a2">ipad</a>
                        <a class="a2">热水器</a>
                        <a class="a2">沙发</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="fenlei">
        <div class="f w">
            <div class="f1">
                <div class="dt">
                    分类
                </div>
                <div class="daohang">
                    <ul class="list-l">
                        <li class="list-l1"><img class="tu" src="https://image5.suning.cn/uimg/cms/img/159823772695221015.png"><a href="#">手机</a><em>|</em><a href="#">运营商</a>
                            <div class="list-ll1">
                                <div class="small-top">
                                    <a href="">手机电脑馆</a>
                                    <a href="">手机频道</a>
                                    <a href="">智能数码</a>
                                    <a href="">以旧换新</a>
                                    <a href="">新品抢先</a>
                                    <a href="">网上营业厅</a>
                                    <a href="">企业采购</a>
                                </div>
                                <div class="small-mid">
                                    <dl class="ddl-1">
                                        <dt>
                                            <a href="">手机通讯</a>
                                        </dt>
                                        <dd>
                                            <a href="">全部手机</a>
                                            <a href="">5G手机</a>
                                            <a href="">游戏手机</a>
                                            <a href="">iPhone</a>
                                            <a href="">小米</a>
                                            <a href="">iQOO</a>
                                            <a href="">vivo</a>
                                            <a href="">OPPO</a>
                                            <a href="">荣耀</a>
                                            <a href="">华为</a>
                                            <a href="">一加</a>
                                            <a href="">三星</a>
                                            <a href="">魅族</a>
                                            <a href="">realme</a>
                                            <a href="">守护宝</a>
                                            <a href="">努比亚</a>
                                            <a href="">诺基亚</a>
                                            <a href="">以旧换新</a>
                                            <a href="">手机维修</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-2">
                                        <dt>
                                            <a href="">手机配件</a>
                                        </dt>
                                        <dd>
                                            <a href="">移动电源</a>
                                            <a href="">苹果数据线</a>
                                            <a href="">安卓数据线</a>
                                            <a href="">三合一数据线</a>
                                            <a href="">手机壳</a>
                                            <a href="">手机耳机</a>
                                            <a href="">手机贴膜</a>
                                            <a href="">手机U盘</a>
                                            <a href="">充电器</a>
                                            <a href="">手机储存卡</a>
                                            <a href="">无线充电器</a>
                                            <a href="">有线耳机</a>
                                            <a href="">手机电池</a>
                                            <a href="">自拍杆</a>
                                            <a href="">手机支架</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-3">
                                        <dt>
                                            <a href="">智能设备</a>
                                        </dt>
                                        <dd>
                                            <a href="">智能手表</a>
                                            <a href="">智能门锁</a>
                                            <a href="">小米</a>
                                            <a href="">凯迪仕</a>
                                            <a href="">无人机</a>
                                            <a href="">平衡车</a>
                                            <a href="">智能摄像头</a>
                                            <a href="">智能手环</a>
                                            <a href="">智能翻译机</a>
                                            <a href="">智能机器人</a>
                                            <a href="">VR眼镜</a>
                                            <a href="">智能健康秤</a>
                                            <a href="">智能健康检测</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-4">
                                        <dt>
                                            <a href="">影音电子</a>
                                        </dt>
                                        <dd>
                                            <a href="">无线耳机</a>
                                            <a href="">降噪耳机</a>
                                            <a href="">AirPods</a>
                                            <a href="">华为</a>
                                            <a href="">小米</a>
                                            <a href="">索尼</a>
                                            <a href="">真无线耳机</a>
                                            <a href="">头戴式耳机</a>
                                            <a href="">蓝牙耳机</a>
                                            <a href="">运动耳机</a>
                                            <a href="">蓝牙音箱</a>
                                            <a href="">MP3/MP4</a>
                                            <a href="">录音笔</a>
                                            <a href="">收音/收音机</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-5">
                                        <dt>
                                            <a href="">电子教育</a>
                                        </dt>
                                        <dd>
                                            <a href="">学生电脑/学习机</a>
                                            <a href="">步步高家教机</a>
                                            <a href="">小天才儿童手表</a>
                                            <a href="">儿童手表</a>
                                            <a href="">电子词典</a>
                                            <a href="">故事机</a>
                                            <a href="">翻译机</a>
                                            <a href="">点读机/笔</a>
                                            <a href="">电子书</a>
                                            <a href="">复读机</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-6">
                                        <dt>
                                            <a href="">二手优品</a>
                                        </dt>
                                        <dd>
                                            <a href="">iPhone11</a>
                                            <a href="">iPhone 7</a>
                                            <a href="">iPhone 8</a>
                                            <a href="">iPhone X</a>
                                            <a href="">iPhone 8p</a>
                                            <a href="">iPhone 7p</a>
                                            <a href="">oppo</a>
                                            <a href="">vivo</a>
                                            <a href="">三星</a>
                                            <a href="">华为</a>
                                            <a href="">小米</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-7">
                                        <dt>
                                            <a href="">苏宁互联</a>
                                        </dt>
                                        <dd>
                                            <a href="">尾号888靓号</a>
                                            <a href="">0月组号卡</a>
                                            <a href="">20GB大流量</a>
                                            <a href="">超级靓号</a>
                                            <a href="">立即选号</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-8">
                                        <dt>
                                            <a href="">营业厅</a>
                                        </dt>
                                        <dd>
                                            <a href="">手机卡</a>
                                            <a href="">大流量卡</a>
                                            <a href="">宽带</a>
                                            <a href="">办套餐</a>
                                            <a href="">充话费/流量</a>
                                            <a href="">中国移动</a>
                                            <a href="">中国电信</a>
                                            <a href="">中国联通</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-9">
                                        <dt>
                                            <a href="">会员卡</a>
                                        </dt>
                                        <dd>
                                            <a href="">去哪儿+芒果TV视频双年卡</a>
                                            <a href="">芒果TV年卡</a>
                                            <a href="">同程黑鲸会员送腾讯视频年卡</a>
                                        </dd>
                                    </dl>
                                </div>
                            </div>
                        </li>
                        <li class="list-l2"><img class="tu" src="https://image2.suning.cn/uimg/cms/img/159823778233607035.png"><a href="#">家用电器</a><em>|</em><a href="#">帮客</a>
                            <div class="list-ll2">
                                <div class="small-top">
                                    <a href="">电器城</a>
                                    <a href="">空调频道</a>
                                    <a href="">冰箱/洗衣机频道</a>
                                    <a href="">彩电频道</a>
                                    <a href="">以旧换新</a>
                                </div>
                                <div class="small-mid">
                                    <dl class="ddl-1">
                                        <dt>
                                        <a href="">空调</a>
                                    </dt>
                                        <dd>
                                            <a href="">【优选空调,以旧换新省650】</a>
                                            <a href="">挂机</a>
                                            <a href="">柜机</a>
                                            <a href="">变频</a>
                                            <a href="">新风空调</a>
                                            <a href="">移动空调</a>
                                            <a href="">空调套餐</a>
                                            <a href="">1匹</a>
                                            <a href="">1.5匹</a>
                                            <a href="">2匹</a>
                                            <a href="">3匹</a>
                                            <a href="">格力</a>
                                            <a href="">海尔</a>
                                            <a href="">TCL</a>
                                            <a href="">海信</a>
                                            <a href="">科龙</a>
                                            <a href="">华凌</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-2">
                                        <dt>
                                        <a href="">电视</a>
                                    </dt>
                                        <dd>
                                            <a href="">【电视家影至享24期免息】</a>
                                            <a href="">75英寸</a>
                                            <a href="">65英寸</a>
                                            <a href="">55英寸</a>
                                            <a href="">海信</a>
                                            <a href="">创维</a>
                                            <a href="">小米</a>
                                            <a href="">TCl</a>
                                            <a href="">pptv</a>
                                            <a href="">索尼</a>
                                            <a href="">长虹</a>
                                            <a href="">三星</a>
                                            <a href="">智慧屏</a>
                                            <a href="">4k超高清</a>
                                            <a href="">全面屏</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-3">
                                        <dt>
                                        <a href="">冰箱</a>
                                    </dt>
                                        <dd>
                                            <a href="">【冰箱洗衣机 每1000减100】</a>
                                            <a href="">多门</a>
                                            <a href="">对开门</a>
                                            <a href="">十字对开</a>
                                            <a href="">冰箱洗衣机套餐</a>
                                            <a href="">双门</a>
                                            <a href="">风冷(无霜)</a>
                                            <a href="">三门</a>
                                            <a href="">海尔</a>
                                            <a href="">容声</a>
                                            <a href="">美的</a>
                                            <a href="">美菱</a>
                                            <a href="">海信</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-4">
                                        <dt>
                                        <a href="">洗衣机</a>
                                    </dt>
                                        <dd>
                                            <a href="">【洁净洗护 滚筒低至1199】</a>
                                            <a href="">滚筒</a>
                                            <a href="">洗烘一体机</a>
                                            <a href="">波轮</a>
                                            <a href="">洗衣机烘干机套餐</a>
                                            <a href="">大容量</a>
                                            <a href="">烘干机</a>
                                            <a href="">迷你洗衣机</a>
                                            <a href="">变频</a>
                                            <a href="">海尔</a>
                                            <a href="">小天鹅</a>
                                            <a href="">美的</a>
                                            <a href="">西门子</a>
                                            <a href="">海信</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-5">
                                        <dt>
                                        <a href="">冷柜</a>
                                    </dt>
                                        <dd>
                                            <a href="">【爆款冷柜799元起】</a>
                                            <a href="">家用冷柜</a>
                                            <a href="">商用展示柜</a>
                                            <a href="">商用冰柜</a>
                                            <a href="">酒柜/冰吧</a>
                                            <a href="">厨房冷柜</a>
                                            <a href="">星星</a>
                                            <a href="">美菱</a>
                                            <a href="">美的</a>
                                            <a href="">容声</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-6">
                                        <dt>
                                        <a href="">视听影音</a>
                                    </dt>
                                        <dd>
                                            <a href="">家庭影院</a>
                                            <a href="">便携音箱</a>
                                            <a href="">回音壁</a>
                                            <a href="">DVD</a>
                                            <a href="">功放</a>
                                            <a href="">KTV音响</a>
                                            <a href="">智能投影</a>
                                        </dd>
                                    </dl>
                                    <dl class="ddl-7">
                                        <dt>
                                        <a href="">帮课服务</a>
                                    </dt>
                                        <dd>
                                            <a href="">【清凉夏日,148元洗两台空调】</a>
                                            <a href="">家电清洗</a>
                                            <a href="">家政保洁</a>
                                            <a href="">洗衣洗鞋</a>
                                            <a href="">家电维修</a>
                                            <a href="">安装拆机</a>
                                            <a href="">除甲醛</a>
                                            <a href="">帮课材配</a>
                                            <a href="">帮课蓝狮</a>
                                        </dd>
                                    </dl>
                                </div>
                            </div>
                        </li>
                        <li><img class="tu" src="https://image3.suning.cn/uimg/cms/img/159521436499527653.png"><a href="#">厨卫</a><em>|</em><a href="#">生活家电</a><em>|</em><a href="#">厨具</a></li>
                        <li><img class="tu" src="https://image3.suning.cn/uimg/cms/img/159521445289226582.png"><a href="#">电脑办公</a><em>|</em><a href="#">相机</a></li>
                        <li><img class="tu" src="https://image5.suning.cn/uimg/cms/img/159521457914933994.png"><a href="#">家具</a><em>|</em><a href="#">家装</a><em>|</em><a href="#">家纺</a><em>|</em><a href="#">灯具</a></li>
                        <li><img class="tu" src="https://image3.suning.cn/uimg/cms/img/159521467494115353.png"><a href="#">食品</a><em>|</em><a href="#">酒水</a><em>|</em><a href="#">生鲜</a><em>|</em><a href="#">特产</a></li>
                        <li><img class="tu" src="https://image5.suning.cn/uimg/cms/img/159521511071559464.png"><a href="#">美妆</a><em>|</em><a href="#">个护</a><em>|</em><a href="#">清洁</a><em>|</em><a href="#">宠物</a></li>
                        <li><img class="tu" src="https://image5.suning.cn/uimg/cms/img/159521519805876875.png"><a href="#">母婴</a><em>|</em><a href="#">玩具</a><em>|</em><a href="#">车床</a><em>|</em><a href="#">童装</a></li>
                        <li><img class="tu" src="https://image3.suning.cn/uimg/cms/img/159521553751456837.png"><a href="#">运动</a><em>|</em><a href="#">户外</a><em>|</em><a href="#">国米</a><em>|</em><a href="#">骑行</a></li>
                        <li><img class="tu" src="https://image3.suning.cn/uimg/cms/img/159521561707762538.png"><a href="#">女装</a><em>|</em><a href="#">男装</a><em>|</em><a href="#">内衣</a><em>|</em><a href="#">鞋子</a></li>
                        <li><img class="tu" src="https://image2.suning.cn/uimg/cms/img/159521571065832724.png"><a href="#">箱包</a><em>|</em><a href="#">钟表</a><em>|</em><a href="#">珠宝</a><em>|</em><a href="#">艺术</a></li>
                        <li><img class="tu" src="https://image1.suning.cn/uimg/cms/img/159521577313810168.png"><a href="#">汽车</a><em>|</em><a href="#">电摩</a><em>|</em><a href="#">汽车用品</a></li>
                        <li><img class="tu" src="https://image5.suning.cn/uimg/cms/img/159521583003884630.png"><a href="#">图书</a><em>|</em><a href="#">艺术</a><em>|</em><a href="#">原版</a><em>|</em><a href="#">文学</a></li>
                        <li><img class="tu" src="https://image2.suning.cn/uimg/cms/img/159521587904815341.png"><a href="#">医药健康</a><em>|</em><a href="#">计生情趣</a></li>
                        <li><img class="tu" src="https://image5.suning.cn/uimg/cms/img/159521591911148163.png"><a href="#">理财</a><em>|</em><a href="#">分析</a><em>|</em><a href="#">便民</a></li>
                    </ul>
                </div>
            </div>
            <div class="f2">
                <ul>
                    <li>
                        <a href="https://qiang.suning.com/pc/brandBenefits.html"><img src="https://image2.suning.cn/uimg/cms/img/161185054090483911.png" alt="大聚惠"></a>
                    </li>
                    <li><a href="https://dianqi.suning.com/?safp=d488778a.homepagev8.126605238663.2&safpn=10001">电器城</a></li>
                    <li><a href="">手机数码</a></li>
                    <li><a href="">苏宁超市</a></li>
                    <li><a href="">家具建材</a></li>
                    <li><a href="">生活家电</a></li>
                    <li><a href="">帮课服务</a></li>
                    <li><a href="">金融</a></li>
                </ul>
            </div>
            <div class="f3">
                <div class="gongshi">
                    <a href="https://hc.suning.com/help/channel-154537312397774529.htm"><img src="https://image1.suning.cn/uimg/cms/img/159525719075727245.png" alt=""></a>
                </div>
            </div>
        </div>
    </div>
    <div class="banner">
        <div class="banxin w">
            <div class="main">
                <div class="g">
                    <a href="https://cuxiao.suning.com/scms/CWSH0527copy.html?safp=d488778a.homepagev8.126605338677.2&safpn=10001" target="_blank"><img src="https://image3.suning.cn/uimg/cms/img/165724844342772183.jpg"></a>
                    <div class="g1">
                        <a href="#"><img src="https://oss.suning.com/adpp/creative_kit/material/picture/20211119-048317170f5a4018b9cc4bddc817fea133c331fa3e52466f.png" alt=""></a>
                        <a href="#"><img src="https://oss.suning.com/adpp/creative_kit/material/picture/20220209-b6d966115c0647a987fe376dfdff2ee725b7b7ebe04647d1.png" alt=""></a>
                        <a href="#"><img src="https://oss.suning.com/adpp/creative_kit/material/picture/20210906-8108ad119b6d46dfbe01d606b54c7e3e85d67bf321e64a15.png" alt=""></a>
                        <a href="#"><img src="https://oss.suning.com/adpp/creative_kit/material/picture/20220214-0d2eaccd362040de9b46b2db22d818ddb58eb246bfbd46fe.png" alt=""></a>
                    </div>
                </div>
                <div class="hi">
                    <div class="A">
                        <a href="#"><img src="Snipaste_2022-07-12_13-43-33.png" alt=""></a>
                        <div class="AA">
                            <p>Hi,欢迎来到苏宁易购</p>
                            <a href="#">登录|注册</a>
                        </div>
                    </div>
                    <div class="B">
                        <a class="new" href="//cuxiao.suning.com/scms/xinren_pc.html" target="_blank" title="199新人专享">199新人专享</a>
                        <a class="super" href="//supervip.suning.com/snprime-web/toIndex.do" target="_blank" title="开通super尊享特权">开通super尊享特权</a>
                    </div>
                    <div class="C">
                        <a href="#">
                            <img src="https://image2.suning.cn/uimg/cms/img/159503668779632788.png" alt="">
                            <p>领红包</p>
                        </a>
                        <a href="#">
                            <img src="https://image5.suning.cn/uimg/cms/img/165752920559657094.png" alt="">
                            <p>以旧换新</p>
                        </a>
                        <a href="#">
                            <img src="https://image5.suning.cn/uimg/cms/img/159503691577022653.png" alt="">
                            <p>抢神券</p>
                        </a>
                    </div>
                    <div class="D">
                        <ul>
                            <li>
                                <a href="#"><img src="https://image5.suning.cn/uimg/cms/img/165750662907502282.png" alt=""></a>
                                <p>手机馆</p>
                            </li>
                            <li>
                                <a href="#"><img src="https://image3.suning.cn/uimg/cms/img/165750705002170538.png" alt=""></a>
                                <p>电器城</p>
                            </li>
                            <li>
                                <a href="#"><img src="https://image2.suning.cn/uimg/cms/img/165752909464915600.png" alt=""></a>
                                <p>家装馆</p>
                            </li>
                            <li>
                                <a href="#"><img src="https://image1.suning.cn/uimg/cms/img/159503709286557735.png" alt=""></a>
                                <p>理财</p>
                            </li>
                            <li>
                                <a href="#"><img src="https://image1.suning.cn/uimg/cms/img/159503712299629769.png" alt=""></a>
                                <p>分期</p>
                            </li>
                            <li>
                                <a href="#"><img src="https://image5.suning.cn/uimg/cms/img/165750696392811339.png" alt=""></a>
                                <p>苏宁卡</p>
                            </li>
                            <li>
                                <a href="#"><img src="https://image4.suning.cn/uimg/cms/img/165750681102299986.png" alt=""></a>
                                <p>药品信息</p>
                            </li>
                            <li>
                                <a href="#"><img src="https://image2.suning.cn/uimg/cms/img/165752913610070145.png" alt=""></a>
                                <p>苏宁帮课</p>
                            </li>
                            <li>
                                <a href="#"><img src="https://image1.suning.cn/uimg/cms/img/165750694630657957.png" alt=""></a>
                                <p>苏宁公益</p>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="center">
        <div class="gc">
            <div class="w">
                <div class="h">
                    <a href="#"><img src="https://image2.suning.cn/uimg/cms/img/165720359406245083.png" alt=""></a>
                    <div class="h1">
                        <ul>
                            <li>
                                <a href="#"><img src="https://imgservice5.suning.cn/uimg1/b2c/image/WUPNDInlXPUSPeqe9FPsvw.jpg_200w_200h_4e" alt=""></a>
                                <p class="title">【9瓶】天地精华低钠淡泉水1L*9/箱天然矿泉适合母婴幼儿水天然矿泉水瓶装便携</p>
                                <p class="title2">
                                    <span>
                                        <i>¥</i>
                                        <em>69.90</em>
                                    </span>
                                </p>
                            </li>
                            <li>
                                <a href="#"><img src="https://image1.suning.cn/uimg/cms/img/165759048526814430.jpg" alt=""></a>
                                <p class="title">VAPE日本未来驱蚊水金色三倍天使 200ml/瓶 宝宝儿童驱蚊喷雾驱蚊液蚊叮虫咬 新生儿可用</p>
                                <p class="title2">
                                    <span>
                                        <i>¥</i>
                                        <em>39.00</em>
                                    </span>
                                </p>
                            </li>
                            <li>
                                <a href="#"><img src="https://image1.suning.cn/uimg/cms/img/165750569250157114.jpg" alt=""></a>
                                <p class="title">【5KG】北大荒东北长粒香大米5KG 当季新米 现磨现发 米砖包装 粳米稻香稻花香长粒香</p>
                                <p class="title2">
                                    <span>
                                        <i>¥</i>
                                        <em>39.90</em>
                                    </span>
                                </p>
                            </li>

                        </ul>
                    </div>
                </div>
                <div class="i">
                    <div class="h">
                        <a href="#"><img src="https://image5.suning.cn/uimg/cms/img/161190026050858417.png" alt=""></a>
                        <div class="h1">
                            <ul>
                                <li>
                                    <a href="#"><img src="https://imgservice.suning.cn/uimg1/pcpv/pcpv/whitePic/2022/06/22/21/8dcd42ceecc948f2994edec35bb7ee61.png?format=200h_200w_4e" alt=""></a>
                                    <p class="title">格力(GREE)空调KFR-35GW/NhAe1BG 云恬新能效变频1.5匹挂一级能效 家用WIFI智控 壁挂式冷暖空调</p>
                                    <p class="title2">
                                        <span> 
                                            <i>¥</i>
                                            <em>3699.00</em>
                                        </span>
                                    </p>
                                </li>
                                <li>
                                    <a href="#"><img src="https://imgservice.suning.cn/uimg1/pcpv/pcpv/whitePic/2022/04/19/17/0b3cd8df8e76405d9190e7cd5d87b0e0.png?format=200h_200w_4e" alt=""></a>
                                    <p class="title">容声(Ronshen)592升对开门冰箱双开门大容量 一级能效双变频 AIF+离子抑菌净味 BCD-592WD16HPA</p>
                                    <p class="title2">
                                        <span>
                                            <i>¥</i>
                                            <em>2999.00</em>
                                        </span>
                                    </p>
                                </li>
                                <li>
                                    <a href="#"><img src="https://imgservice.suning.cn/uimg1/sniss/improve/FDW4bI3nM4DKoMY--9Cuxw.jpg?format=200h_200w_4e" alt=""></a>
                                    <p class="title">大宇(DAEWOO)多功能锅网红料理锅 家用电火锅电热炒锅电烧烤炉电煮锅不粘锅 S11升级款白色</p>
                                    <p class="title2">
                                        <span>
                                            <i>¥</i>
                                            <em>899.00</em>
                                        </span>
                                    </p>
                                </li>

                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- <div class="zx">
            <div class="w">
                <div class="j">
                    <a class="j1" href="#">领券中心</a>
                    <div class="h1">
                        <ul>
                            <li>
                                <a href="#"><img src="https://image2.suning.cn/uimg/cms/img/165545542672232250.jpg" alt=""></a>
                                <p class="title">【9瓶】天地精华低钠淡泉水1L*9/箱天然矿泉适合母婴幼儿水天然矿泉水瓶装便携</p>
                                <p class="title2">
                                    <span>
                                        <i>¥</i>
                                        <em>69.90</em>
                                    </span>
                                </p>
                            </li>
                            <li>
                                <a href="#"><img src="https://image1.suning.cn/uimg/cms/img/165759048526814430.jpg" alt=""></a>
                                <p class="title">VAPE日本未来驱蚊水金色三倍天使 200ml/瓶 宝宝儿童驱蚊喷雾驱蚊液蚊叮虫咬 新生儿可用</p>
                                <p class="title2">
                                    <span>
                                        <i>¥</i>
                                        <em>39.00</em>
                                    </span>
                                </p>
                            </li>
                            <li>
                                <a href="#"><img src="https://image1.suning.cn/uimg/cms/img/165750569250157114.jpg" alt=""></a>
                                <p class="title">【5KG】北大荒东北长粒香大米5KG 当季新米 现磨现发 米砖包装 粳米稻香稻花香长粒香</p>
                                <p class="title2">
                                    <span>
                                        <i>¥</i>
                                        <em>39.90</em>
                                    </span>
                                </p>
                            </li>

                        </ul>
                    </div>
                </div>
                <div class="k"></div>
            </div>
        </div> -->
    </div>
    <div class="footer">
        <div class="w">
            <div class="zhengpin">
                <ul>
                    <li>
                        <a href="https://hc.suning.com/help/channel-153317984655227247/K15399193370991400.htm"><img src="https://image.suning.cn/uimg/cms/img/149386338830969041.jpg" alt=""></a>
                        <div class="service">
                            <h4>正品保障</h4>
                            <p>正品保障、提供发票</p>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="zhengpin">
                <ul>
                    <li>
                        <a href="https://hc.suning.com/help/channel-153317984655227247/K15399193697723000.htm"><img src="https://image.suning.cn/uimg/cms/img/149386339441846551.jpg" alt=""></a>
                        <div class="service">
                            <h4>急速物流</h4>
                            <p>如约送货、送货入户</p>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="zhengpin">
                <ul>
                    <li>
                        <a href="https://hc.suning.com/help/channel-153320144068611677/K15350932410567650.htm"><img src="https://image.suning.cn/uimg/cms/img/149386340040069121.jpg" alt=""></a>
                        <div class="service">
                            <h4>售后无忧</h4>
                            <p>30天包退、365天包换</p>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="zhengpin">
                <ul>
                    <li>
                        <a href="https://hc.suning.com/help/home.htm"><img src="https://image.suning.cn/uimg/cms/img/149386341371637387.jpg" alt=""></a>
                        <div class="service">
                            <h4>帮助中心</h4>
                            <p>您的购物指南</p>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="zhengpin">
                <ul>
                    <li>
                        <a href="https://hc.suning.com/help/channel-155152683733394541.htm"><img src="https://image.suning.cn/uimg/cms/img/159609703272398060.png" alt=""></a>
                        <div class="service">
                            <h4>省心购</h4>
                            <p>专注好服务</p>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</body>

</html>

最后

以上就是闪闪巨人为你收集整理的仿照苏宁易购的简单网站制作(包含效果图及其代码)的全部内容,希望文章能够帮你解决仿照苏宁易购的简单网站制作(包含效果图及其代码)所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(41)

评论列表共有 0 条评论

立即
投稿
返回
顶部