模仿百度糯米的练习

最新推荐文章于 2019-10-09 16:41:30 发布
原创 最新推荐文章于 2019-10-09 16:41:30 发布 · 575 阅读 · 7 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
         #all{
            width: 1349px;
            height: 2932px;
            /* https://blog.youkuaiyun.com/Ariel_201311/article/details/79947377 针对写好的网页会岁流浪起的界面变小而变乱 */
        }
        *{
            margin: 0;
            padding: 0;
        }
        #header{
            width: 100%;
            height: 40px;
            background-color: #f2f2f2;
            display:flex;
            color: #666;
            align-items:center;
            font-size: 14px;
        }
        .header_left{
            margin-left: 69.5px;
            width: 255px;
            height: 40px;
            display:flex;
            justify-content:space-between;
            align-items:center;
        }
        .header_right{
            margin-right: 69.5px;
            margin-left: 425px;
            display:flex;
            justify-content:space-between;
            width: 515px;
            height: 40px;
            /* 弹性盒子居中 */
            align-items:center;
        }
        /* 以前总结 弹性盒子一定要给宽高 要确认好每一个盒子 */

        #contenter{
            width: 100%;
            height: 2600px;
            display: flex;
        }
        .con_left{
            width: 69.5px;
            height: 1200px;
            /* background-color:lawngreen; */
        }
        .content{
            width: 1210px;
            height: 1200px;
        }

        .ShouSuo{
            width: 1210px;
            height: 89px;
            /* background-color: aqua; */
            margin-top: 21px;
        }
        .ShouSuo1{
            width: 1210px;
            height: 57px;
            /* background-color: red; */
            display: flex;
            align-items: center;
        }
        .Log{
            width: 165px;
            height: 57px;
            /* background-color: chocolate; */
            background-image: url(1.png);
            background-repeat: no-repeat;
            background-size: 100%;
        }
        .DiZhi{
            width: 32px;
            height: 21px;
            /* background-color:navy; */
            margin-left: 54px;
            margin-right: 88px;
        }
        .ShouSuoX{
            width: 452px;
            height: 14px;
            padding-top: 11px;
            padding-bottom: 11px;
            padding-left: 12px;
            /* background-color: brown; */
            border: 2px #cda45a solid;
        }
        .ShouSuoAnNiu{
            width: 100px;
            height: 40px;
            background-color: #cda45a;
            border: 0;
            margin-left: -2px;
            color: white;
            font-size: 20px;
        }
        #TuiPei{
            width: 149px;
            height: 40px;
            background-image: url(2.png);
            background-repeat: no-repeat;
            background-size: 90%;
            margin-left: 20px;
        }
        .ShouSuo2{
            width: 1210px;
            height: 19px;
            display:flex;
            align-items: center;
        }
        .ShouSuo2Item{
            margin-right: 20px;
            font-size:14px;
            color: #b4b4b4;
        }


        .FenLei{
            width: 1210px;
            height: 434px;
            display:flex;
            /* background-color: #cda45a; */
        }
        .Fenlei_left{
            width: 233px;
            height: 434px;
            background-color:  #313131;
        }
        .Fenlei_right{
            width: 977px;
            height: 434px;
            /* background-color: aqua; */
        }
       li{
           list-style: none;
       }
      div>ul>li{
          display:flex;
          justify-content:space-between;
          /* background-color: #313131; */
          height: 49.5px;
          align-items:center;
          padding-left: 16px;
          
      }
      ul{
        color: white;
        
      }
      ul>li>ul{
        display:flex;
      }
      ul>div.QuanBuFenlei{
        height: 44px;
        line-height: 44px;
        background-color:#cda55a;
        padding-left: 16px;
        font-size: 18px;
      }
      ul>li>ul>li{
          color: #b4b4b4;
          font-size: 12px;
          margin-right: 4px;
      }
      ul>li>ul:last-child{
        margin-right: 10px;
      }

      .Fenlei_right_top{
        height: 44px;
        /* background-color: chocolate; */
        border-bottom: 2px #cda55a solid;
      }

      .Fenlei_right_top>span{
          line-height: 44px;
          margin-right: 62px;
          /* margin-left: 10px; */
      }
      .Fenlei_right_top>span:first-child{
          margin-left: 32px;
      }

      .Fenlei_right_buttom{
          height: 388px;
          padding-top: 1px;
          display:flex;
      }
      .Fenlei_right_buttom_left{
          width: 713px;
          height: 373px;
          background-image: url(3.png);
            background-repeat: no-repeat;
            background-size: 100%;
            margin-left: 10px;
            /* margin-top坍塌，用paading-top隔离下 */
            margin-top: 16px;
      }
      .Fenlei_right_buttom_right{
          width: 236px;
        height: 371px;
        /* background-color: aqua; */
        margin-top: 16px;
        margin-left: 20px;
      }
      .Fenlei_right_buttom_right_1{
          width: 236px;
          height: 165px;
          background-image: url(4.png);
            background-repeat: no-repeat;
            background-size: 100%;
      }
      .Fenlei_right_buttom_right_2{
          width: 236px;
          height: 195px;
          background-image: url(5.png);
            background-repeat: no-repeat;
            background-size: 100%;
            margin-top: 11px;
      }

      .ReYinDianYinBT{
          width: 1210px;
          height: 24px;
          display: flex;
          justify-content:space-between;
          /* background-color:cadetblue; */
          margin-top: 50px;
      }
      .ReYinDianYinBTLeft{
          width: 96px;
          height: 24px;
          /* background-color: aqua; */
          font-size: 24px;
          margin-top: -5px;
      }
      .ReYinDianYinBTRight{
          width: 269px;
          height: 24px;
          /* background-color: aqua; */
          display: flex;
          justify-content:space-between;
          
         margin-top: 5px;;
         font-size: 14px;
      }
    

      .ReYinDianYin{
          margin-top: 21px;
          width: 1210px;
          /* 180 */
          height: 265px;
          display: flex;
          justify-content:space-between;
      }
      .ReYinDianYinIn{
        width: 180px;
          /* 180 */
          height: 355px;
          /* 265+90 */
          /* background-color: aquamarine; */
          text-align: center;
      }

      .ReYinDianYinIn1{
          width:180px ;
          height: 265px;
          background-image: url(img/11.jpg);
          background-repeat: no-repeat;
          background-size: 100%;
      }
      .ReYinDianYinIn12{
          width:180px ;
          height: 265px;
          background-image: url(img/12.jpg);
          background-repeat: no-repeat;
          background-size: 100% 120%;
      }
      .ReYinDianYinIn13{
          width:180px ;
          height: 265px;
          background-image: url(img/13.jpg);
          background-repeat: no-repeat;
          background-size: 100%;
          background-size: 100% 120%;
      }
      .ReYinDianYinIn14{
          width:180px ;
          height: 265px;
          background-image: url(img/14.jpg);
          background-repeat: no-repeat;
          background-size: 100%;
          background-size: 100% 120%;
      }
      .ReYinDianYinIn15{
          width:180px ;
          height: 265px;
          background-image: url(img/15.jpg);
          background-repeat: no-repeat;
          background-size: 100%;
          background-size: 100% 120%;
      }
      .ReYinDianYinIn16{
          width:180px ;
          height: 265px;
          background-image: url(img/16.jpg);
          background-repeat: no-repeat;
          background-size: 100%;
          background-size: 100% 120%;
      }
      .ReYinDianYinIn2{
          padding-top: 20px;
          padding-bottom: 16px;
      }
      .ReYinDianYinIn3{
        
        margin: 0 auto;
width: 120px;
height: 34px;
line-height: 34px;
border: 1px solid #BF954D;
border-radius: 2px;
font-size: 14px;
color: #BF974D;
text-align: center;
      }
      /* 休闲复用热映的代码，不适用的开始改 */
      .ReYinDianYinInXiuXian{
        width: 222px;
          /* 180 */
          height: 271.2px;
          /* 265+90 */
          /* background-color: aquamarine; */
          text-align: left;
          color: #666;
          font-size: 14px;
      }
      .ReYinDianYinIn1XiuXian{
        width:222px ;
          height: 155px;
          background-image: url(img/21.jpg);
          background-repeat: no-repeat;
          background-size: 120% 100%;
      }
      .ReYinDianYinIn1XiuXian2{
        width:222px ;
          height: 155px;
          background-image: url(img/22.jpg);
          background-repeat: no-repeat;
          background-size: 120% 100%;
      }
      .ReYinDianYinIn1XiuXian3{
        width:222px ;
          height: 155px;
          background-image: url(img/23.jpg);
          background-repeat: no-repeat;
          background-size: 120% 100%;
      }
      .ReYinDianYinIn1XiuXian4{
        width:222px ;
          height: 155px;
          background-image: url(img/24.jpg);
          background-repeat: no-repeat;
          background-size: 120% 100%;
      }
      .ReYinDianYinIn1XiuXian5{
        width:222px ;
          height: 155px;
          background-image: url(img/25.jpg);
          background-repeat: no-repeat;
          background-size: 120% 100%;
      }
      .ReYinDianYinIn2XiuXian{
          text-align: left;
          font-size: 18px;
          margin-top: 17px;
          margin-bottom: 7px;
          color: black;
      }
      .ReYinDianYinIn2XiuXian2{
          width: 222px;
          height: 16px;
          display: flex;
          justify-content:space-between;
          margin-top: 9px;
          margin-bottom: 9px;
      }
      .ReYinDianYinIn2XiuXian2Left{
        width:86px ;
          height: 12px;
          background-image: url(img/2001.png);
          background-repeat: no-repeat;
          background-size: 100%;
      }


      .LvYouBT{
          margin-top: 74px;
          width: 1210px;
          height: 24px; 
          /* background-color: blueviolet; */
          display: flex;
          justify-content:space-between;
          /* background-color:cadetblue; */
          /* margin-top: 50px; */
      }
    
      .LvYouBTLeft{
          width: 96px;
          height: 24px;
          /* background-color: aqua; */
          font-size: 24px;
          margin-top: -5px;
      }
      /* 写漏了一个class 很尴尬 */
      .ReYinDianYinBTRightRight{
          font-size: 14px;
      }

      .LvYou{
          width: 1210px;
          height: 340px;
          display:flex;
          justify-content:space-between;
          margin-top: 18px;
      }
      .LY1{
        width:387px ;
          height: 340px;
          background-image: url(img/31.jpg);
          background-repeat: no-repeat;
          background-size:100%;
      }
      .LY2{
        width:387px ;
          height: 340px;
          background-image: url(img/32.jpg);
          background-repeat: no-repeat;
          background-size:100%;
      }
      .LY3{
        width:387px ;
          height: 340px;
          background-image: url(img/33.jpg);
          background-repeat: no-repeat;
          background-size:100%;
      }
      /* 结婚复用了旅游的代码，稍稍改掉一些不同的 */
      .JieHun3{
        width:387px ;
          height: 340px;
          display:flex;
          /* 这里想到了一个非常好用的东西 弹性布局也是可以布局上下的 */
          justify-content:space-between;
          flex-direction: column;
      }
      .JieHun31{
        width:387px ;
          height: 158px;
          background-image: url(img/43.jpg);
          background-repeat: no-repeat;
          background-size:100%;
      }


      /* 商场的标题复用了 */
      .SC{
          width: 1210px;
          height: 33px;
          display: flex;
          justify-content:space-between;
          margin-top: 3px;
      }
      .SCItem{
          width: 199px;
          height: 33px;
          /* background-color: #cda55a; */
          line-height: 33px;
          color: #666;
          font-size: 14px;
      }
      
      #footer{
          /* margin: 0 auto; */
          /* margin-top: 1px; */
          /* padding-top: 47px; */
          width: 1349px;
          height: 289.9px;
          /* padding-bottom: 40px; */
          background-color: #f2f2f2;
      }

      .footer_top{
          width: 1210px;
          height: 150px;
          /* background-color: aqua; */
          margin: 0 auto;
          padding-top: 47px;
          padding-bottom: 30px;
          display: flex;
          /* flex-wrap: nowrap; */
      }
      .footer_top1{
          width: 242px;
          height: 150px;
          /* background-color: brown; */
      }
      .footer_top_1_1{
          font-size: 14px;
          color: #666;
          margin-top: 10px;

      }
      .footer_top_1_1_2{
          font-size: 16px;
          color: black;
          margin-bottom: 20px;

      }
      #wangbeihao{
          width: 277px;
          height: 48px;
          background-color: aqua;
          background-image: url(img/wb.png);
          background-repeat:no-repeat;
          background-size: 100%;
          margin: 0 auto;
      }
    </style>
</head>
<body><div id="all">
    <div id="header">
        <div class="header_left">
            <span>Hi，欢迎来到百度糯米</span>
            <span>请登入</span>
            <span>免费注册</span>
        </div>
        <div class="header_right">
            <span>个人中心</span>
            <span>最近浏览</span>
            <span>|</span>
            <span>糯米app</span>
            <span>我是商家</span>
            <span>|</span>
            <span>帮助中心</span>
            <span>食品安全</span>
        </div>
    </div>

    <div id="contenter">
        <div class="con_left"></div>
        <div class="content">

            <div class="ShouSuo">
                <div class="ShouSuo1">
                    <div class="Log"></div>
                    <div class="DiZhi"><span>苏州</span></div>
                
                        <input type="text" class="ShouSuoX">
                        <input type="submit" value="搜索" class="ShouSuoAnNiu">
                        <div id="TuiPei"></div>
                </div>
                <div class="ShouSuo2"> 
                        <span style="margin-left:336px;" class="ShouSuo2Item">上门按摩</span>
                        <span class="ShouSuo2Item">钢琴试学班</span>
                        <span class="ShouSuo2Item">合合餐饮店</span>
                        <span class="ShouSuo2Item">拔罐减肥</span>
                        <span class="ShouSuo2Item">刮痧</span>
                </div>
            </div>

            <div class="FenLei">
                <div class="Fenlei_left">
                    <ul><div class="QuanBuFenlei">
                            <span>全部分类</span>
                    </div>
                        <li>
                                <span>酒店</span>
                            <ul>
                                <li>苏州</li>
                                <li>/</li>
                                <li>北京</li>
                                <li>/</li>
                                <li>上海</li>
                            </ul>
                        </li>
                        <li><span>旅游</span>
                            <ul>
                              <li>目的地攻略</li>
                                <li>/</li>
                                <li>行程计划</li>
                            </ul>
                        </li>
                        <li><span>电影</span>
                            <ul>
                                <li>看影片</li>
                                <li>/</li>
                                <li>找影院</li>
                            </ul>
                        </li>
                        <li><span>休闲娱乐</span>
                                <ul>
                                    <li>足疗按摩</li>
                                    <li>/</li>
                                    <li>演出赛事</li>
                                </ul>
                        </li>
                        <li><span>结婚</span>
                                <ul>
                                    <li>婚纱摄影</li>
                                    <li>/</li>
                                    <li>婚庆服务</li>
                                </ul>
                        </li>
                        <li><span>生活服务</span>
                                <ul>
                                    <li>配镜</li>
                                    <li>/</li>
                                    <li>婚纱摄影</li>
                                </ul>
                        </li>
                        <li><span>美食</span>
                                <ul>
                                    <li>小吃快餐</li>
                                    <li>/</li>
                                    <li>甜品</li>
                                    <li>/</li>
                                    <li>蛋糕</li>
                                </ul>
                        </li>
                        <li><span>丽人</span>
                                <ul>
                                    <li>美容</li>
                                    <li>/</li>
                                    <li>美发SPA</li>
                                    <li>/</li>
                                    <li>美甲</li>
                                </ul>
                        </li>
                    </ul>
                </div>

                <div class="Fenlei_right">
                    <div class="Fenlei_right_top">
                        <span>首页</span>
                        <span>酒店</span>
                        <span>出行</span>
                        <span>电影</span>
                        <span>结婚</span>
                        <span>外卖</span>
                    </div>
                    <div  class="Fenlei_right_buttom">
                        <div class="Fenlei_right_buttom_left"></div>
                        <div class="Fenlei_right_buttom_right">
                            <div class="Fenlei_right_buttom_right_1"></div>
                            <div class="Fenlei_right_buttom_right_2"></div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="ReYinDianYinBT">
                <div class="ReYinDianYinBTLeft"><span>热映电影</span></div>
                <div class="ReYinDianYinBTRight">
                    <div class="ReYinDianYinBTRightLeft">
                        <span>看影片</span>
                        <span>/</span>
                        <span>找影院</span>
                        <span>/</span>
                        <span>看票房</span>
                    </div>
                    <div class="ReYinDianYinBTRightRight">查看全部</div>
                </div>
            </div>
            <div class="ReYinDianYin">
                <div class="ReYinDianYinIn">
                    <div class="ReYinDianYinIn1"></div>
                    <div class="ReYinDianYinIn2"><span>海王</span></div>
                    <div class="ReYinDianYinIn3"><span>选座购票</span></div>
                </div>
                <div class="ReYinDianYinIn">
                    <div class="ReYinDianYinIn12"></div>
                    <div class="ReYinDianYinIn2"><span>大人物</span></div>
                    <div class="ReYinDianYinIn3"><span>选座购票</span></div>
                </div>
                <div class="ReYinDianYinIn">
                    <div class="ReYinDianYinIn13"></div>
                    <div class="ReYinDianYinIn2"><span>来电狂响</span></div>
                    <div class="ReYinDianYinIn3"><span>选座购票</span></div>
                </div>
                <div class="ReYinDianYinIn">
                    <div class="ReYinDianYinIn14"></div>
                    <div class="ReYinDianYinIn2"><span>命运之夜-天之杯</span></div>
                    <div class="ReYinDianYinIn3"><span>选座购票</span></div>
                </div>
                <div class="ReYinDianYinIn">
                    <div class="ReYinDianYinIn15"></div>
                    <div class="ReYinDianYinIn2"><span>白蛇：缘起</span></div>
                    <div class="ReYinDianYinIn3"><span>选座购票</span></div>
                </div>
                <div class="ReYinDianYinIn">
                    <div class="ReYinDianYinIn16"></div>
                    <div class="ReYinDianYinIn2"><span>大黄蜂</span></div>
                    <div class="ReYinDianYinIn3"><span>选座购票</span></div>
                </div>
            </div>
            <hr style="margin-top:118px;color:#ebebeb;height: 1px;">
            <!-- 休闲娱乐复用了热映电影的代码 -->
            <div class="ReYinDianYinBT">
                <div class="ReYinDianYinBTLeft"><span>休闲娱乐</span></div>
                <div class="ReYinDianYinBTRight" style="width: 342px;">
                    <div class="ReYinDianYinBTRightLeft" style="width: 269px;" >
                        <span>KTV</span>
                        <span>/</span>
                        <span>足浴按摩</span>
                        <span>/</span>
                        <span>轰趴馆</span>
                        <span>/</span>
                        <span>运动健身</span>
                    </div>
                    <div class="ReYinDianYinBTRightRight">查看全部</div>
                </div>
            </div>
            <div class="ReYinDianYin">
                <div class="ReYinDianYinInXiuXian">
                    <div class="ReYinDianYinIn1XiuXian"></div>
                    <div class="ReYinDianYinIn2XiuXian"><span>夜泊水疗馆</span></div>
                    <div class="ReYinDianYinIn2XiuXian2">
                        <div class="ReYinDianYinIn2XiuXian2Left"></div>
                        <div class="ReYinDianYinIn2XiuXian2Right"><span>132条评论</span></div>
                    </div>
                    <div class="ReYinDianYinIn2XiuXian2">
                        <div><span>温泉洗浴</span><span>|</span><span>枫桥地区</span></div>
                        <div><span>已售2798</span></div>
                    </div>
                    <div class=""><span>￥68/人</span></div>
                </div>
                <div class="ReYinDianYinInXiuXian">
                        <div class="ReYinDianYinIn1XiuXian2"></div>
                        <div class="ReYinDianYinIn2XiuXian"><span>音乐风</span></div>
                        <div class="ReYinDianYinIn2XiuXian2">
                            <div class="ReYinDianYinIn2XiuXian2Left"></div>
                            <div class="ReYinDianYinIn2XiuXian2Right"><span>132条评论</span></div>
                        </div>
                        <div class="ReYinDianYinIn2XiuXian2">
                            <div><span>温泉洗浴</span><span>|</span><span>枫桥地区</span></div>
                            <div><span>已售2798</span></div>
                        </div>
                        <div class=""><span>￥68/人</span></div>
                    </div>
                    <div class="ReYinDianYinInXiuXian">
                            <div class="ReYinDianYinIn1XiuXian3"></div>
                            <div class="ReYinDianYinIn2XiuXian"><span>星空艺术馆</span></div>
                            <div class="ReYinDianYinIn2XiuXian2">
                                <div class="ReYinDianYinIn2XiuXian2Left"></div>
                                <div class="ReYinDianYinIn2XiuXian2Right"><span>132条评论</span></div>
                            </div>
                            <div class="ReYinDianYinIn2XiuXian2">
                                <div><span>温泉洗浴</span><span>|</span><span>枫桥地区</span></div>
                                <div><span>已售2798</span></div>
                            </div>
                            <div class=""><span>￥68/人</span></div>
                        </div>
                        <div class="ReYinDianYinInXiuXian">
                                <div class="ReYinDianYinIn1XiuXian4"></div>
                                <div class="ReYinDianYinIn2XiuXian"><span>嗨秀派对KTV</span></div>
                                <div class="ReYinDianYinIn2XiuXian2">
                                    <div class="ReYinDianYinIn2XiuXian2Left"></div>
                                    <div class="ReYinDianYinIn2XiuXian2Right"><span>132条评论</span></div>
                                </div>
                                <div class="ReYinDianYinIn2XiuXian2">
                                    <div><span>温泉洗浴</span><span>|</span><span>枫桥地区</span></div>
                                    <div><span>已售2798</span></div>
                                </div>
                                <div class=""><span>￥68/人</span></div>
                            </div>
                            <div class="ReYinDianYinInXiuXian">
                                    <div class="ReYinDianYinIn1XiuXian5"></div>
                                    <div class="ReYinDianYinIn2XiuXian"><span>百乐门贩量式KTV</span></div>
                                    <div class="ReYinDianYinIn2XiuXian2">
                                        <div class="ReYinDianYinIn2XiuXian2Left"></div>
                                        <div class="ReYinDianYinIn2XiuXian2Right"><span>132条评论</span></div>
                                    </div>
                                    <div class="ReYinDianYinIn2XiuXian2">
                                        <div><span>温泉洗浴</span><span>|</span><span>枫桥地区</span></div>
                                        <div><span>已售2798</span></div>
                                    </div>
                                    <div class=""><span>￥68/人</span></div>
                                </div>
            </div>

            <div class="LvYouBT">
                <div class="LvYouBTLeft"><span>旅游</span></div>
                <div class="ReYinDianYinBTRightRight" style="margin-top: 5px;"><span>查看全部</span></div>
            </div>
            <div class="LvYou">
                <div class="LY1"></div>
                <div class="LY2"></div>
                <div class="LY3"></div>
            </div>

            <!-- 结婚复用旅游的代码 -->
            <div class="LvYouBT">
                    <div class="LvYouBTLeft"><span>结婚</span></div>
                    <div class="ReYinDianYinBTRightRight" style="margin-top: 5px;"><span>查看全部</span></div>
                </div>
                <div class="LvYou">
                    <div class="LY1" style="background-image: url(img/41.jpg);"></div>
                    <div class="LY2" style="background-image: url(img/42.jpg);"></div>
                    <div class="JieHun3">
                        <div class="JieHun31"> </div>
                        <div class="JieHun31" style="background-image: url(img/44.jpg);"> </div>
                    </div>
                </div>

                <!-- 复用个标题 热门商场-->
                <div class="LvYouBT">
                        <div class="LvYouBTLeft" style="font-size:16px;"><span>热门商场</span></div>
                    </div>

                    <div class="SC">
                        <div class="SCItem">久光百货</div>
                        <div class="SCItem">久光百货</div>
                        <div class="SCItem">久光百货</div>
                        <div class="SCItem">久光百货</div>
                        <div class="SCItem">久光百货</div>
                    </div>
                    <div class="SC">
                            <div class="SCItem">久光百货</div>
                            <div class="SCItem">久光百货</div>
                            <div class="SCItem">久光百货</div>
                            <div class="SCItem">久光百货</div>
                            <div class="SCItem">久光百货</div>
                    </div>
                    <div class="SC">
                            <div class="SCItem">久光百货</div>
                            <div class="SCItem">久光百货</div>
                            <div class="SCItem">久光百货</div>
                            <div class="SCItem">久光百货</div>
                            <div class="SCItem">久光百货</div>
                    </div>
                    <div class="SC">
                            <div class="SCItem">久光百货</div>
                            <div class="SCItem">久光百货</div>
                            <div class="SCItem">久光百货</div>
                            <div class="SCItem">久光百货</div>
                            <div class="SCItem" style="margin-bottom:1px;padding-bottom:1px;"></div>
                    </div>


                    


        </div>
        <div class="con_left"></div>
    </div>

    <div id="footer">
        <div class="footer_top">
            <div class="footer_top1">
                    <div class="footer_top_1_1 footer_top_1_1_2">用户帮助</div>
                    <div class="footer_top_1_1">常见团购问题</div>
                    <div class="footer_top_1_1">开放API</div>
            </div>
            
            <div class="footer_top1">
                    <div class="footer_top_1_1 footer_top_1_1_2">用户帮助</div>
                    <div class="footer_top_1_1">常见团购问题</div>
                    <div class="footer_top_1_1">开放API</div>
            </div>
            <div class="footer_top1">
                    <div class="footer_top_1_1 footer_top_1_1_2">用户帮助</div>
                    <div class="footer_top_1_1">常见团购问题</div>
                    <div class="footer_top_1_1">开放API</div>
            </div>
            <div class="footer_top1">
                    <div class="footer_top_1_1 footer_top_1_1_2">用户帮助</div>
                    <div class="footer_top_1_1">常见团购问题</div>
                    <div class="footer_top_1_1">开放API</div>
                    <div class="footer_top_1_1">开放API</div>
            </div>
            
            <div class="footer_top1">
                    <div class="footer_top_1_1 footer_top_1_1_2">用户帮助</div>
                    <div class="footer_top_1_1">常见团购问题</div>
                    <div class="footer_top_1_1">开放API</div>
                    <div class="footer_top_1_1">开放API</div>
            </div>
            </div>

            <div id="wangbeihao"></div>
        </div>
    
        
    
</div></body>
</html>
<!-- 百度糯米 未得凌云（技）艺，不想登天梯 https://su.nuomi.com/ -->

css 60分很简单，100分很难

神烦_韦执
关注
tp5 仿百度糯米含源码
06-01
仿百度糯米含源码 视屏齐全，工具齐全，代码齐全
S1HTML项目百度糯米.rar
10-28
S1HTML项目百度糯米.rar
Tp5的使用仿百度糯米
qq_22717749的博客
10-09 391
Tp5的新特性 1.webserver 2.全新的分页机制 3.composer安装tp5扩展类库 4.validate数据验证机制 5.模块自动部署 6.session会话机制 7.验证码 表的设计 学习目标 1.表的创建decimal() 2.索引的使用 （知识点：二叉树、使用索引查询更快、hash索引） decimal(20.2) 20位，小数点后面两 int(11) 整型 11位 将表的...
仿百度糯米TP5项目笔记
aexzrgn26470的博客
10-17 188
需求分析 系统三大模块 商家平台、主平台、前台模块 Thinkphp5.0实战仿百度糯米开发多商家电商平台网盘下载 (2017-04-24 01:46:23) 转载▼ 第1章 课程简介 本章内容会给大家通览本门课程的所有知识点 第2章 需求分析 本章会先带领大家预览下整个系统包括商家、...
Thinkphp5.0 仿百度糯米 开发多商家 电商平台(完整版)
weixin_30300225的博客
08-17 355
目录第1章 课程简介第2章 需求分析第3章 快速掌握thinkphp5第4章 任性的TP5模块第5章 生活服务分类管理模块第6章 百度地图应用封装第7章 打造属于TP5自己的发送邮件服务第8章 商户模块第9章 推荐位管理第10章 前台模块第11章 订单以及微信支付第12章 巧用TP5问题定位&调试第13章 课程总结 Thinkphp5.0仿百度糯米开发多商家电商平台-...
模仿百度糯米-下拉
06-13
在本案例中，我们讨论的是一个模仿百度糯米地区和美食选择功能的程序实现，这涉及到前端开发中的数据处理、DOM操作以及事件监听等多个知识点。 首先，我们需要理解前端框架的基础。这个程序可能基于React、Vue、...
ios-模仿百度糯米的首页实现.zip
07-11
在iOS开发中，模仿百度糯米的首页实现是一个典型的移动端应用设计和开发案例。这个项目可能涉及到多种技术点，包括UI设计、数据管理、网络请求、视图控制器组织以及动画效果等。下面将从这些方面详细阐述相关的iOS...
百度糯米随身wifi驱动 v3.0.7.3 官方版
07-13
百度糯米wifi驱动极速版即小度wifi驱动，是一款可以让你开启随身wifi的驱动程序，由百度糯米团购推出。本wifi驱动是百度为了推广糯米而推出的，用户获得小度wifi后，安装该驱动后即可使用。赶快下载体验吧！功能介绍...
仿百度糯米
12-02
模仿百度糯米： 百度糯米，前身为人人旗下的糯米网，2014年1月百度全资收购糯米网并在2014年3月6日将其更名为百度糯米。 经过几年发展，百度糯米已经从美食、电影、KTV为主的团购服务网站，发展成为国内领先的本地...
仿百度糯米php项目
09-15
【标题】"仿百度糯米php项目"是一个基于PHP的开源电商平台项目，旨在为开发者提供一个类似于百度糯米的网站实现框架，适用于新手学习和实践。这个项目特别强调了使用ThinkPHP5.0框架，这是一个非常流行的PHP开发框架...
仿百度糯米静态文件
07-24
群里下载的，文件齐全。。。。。。。。。。。。。。。。。
仿百度糯米App的源码
11-03
仿百度糯米App的源码 分类 对开发这一方面的App具有参考作用
百度糯米网页
09-22
原生的js+html+css,欢迎大家学习，这里是一个百度糯米的网页书写!
百度糯米源文件(静态文件资源)
11-30
仿百度糯米的源文件 singwa 出品的 o2o
仿美团和百度糯米界面
01-20
仿美团和百度糯米界面，又和这需求一样的可以下载学习。
使用div+css+javascript实现仿百度糯米首页
不会写代码的前端
11-29 2231
通过对div+css的学习 可搭建静态网页 从网页切图到使用dw制作仿百度糯米首页 巩固了对div+css的理解 在此网页中 使用js实现对图片切换以及对选项卡 及侧边栏回到顶部的运用 原理：使用div创建网页结果 使用css对网页进行装饰 使用javascript对网页添加行为 ...
前端百度糯米网页静态开发.zip
05-19
运用css,html开发的一个代码
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值