lovecoding
/
VIP30


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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./demo.css">
</head>

<body>
    <!-- 大盒子 -->
    <div class="box">
        <!-- 头部 -->
        <div class="header">
            <!-- 居中盒子 -->
            <div class="container">
                <div class="container-left">
                    <p>您好，欢迎进入包图网</p>
                    <p>登录 | <span>注册</span></p>
                </div>
                <div class="container-right">
                    <ul>
                        <li>设为首页 ☆</li>
                        <li></li>
                        <li>加入收藏</li>
                        <li></li>
                        <li>客户服务</li>
                        <li></li>
                        <li>加入官方微博:</li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- 主体 -->
        <div class="main">
            <div class="partOne">
                <div class="logo">
                    <img src="./images/logo.png" alt="">
                </div>
                <div class="search">
                    <div class="search-top">
                        <input type="text" placeholder="618活动">
                        <div class="btn">搜索</div>
                    </div>
                    <div class="search-bottom">
                        <ul>
                            <li><a href="">时尚女鞋</a></li>
                            <li><a href="">简易家具</a></li>
                            <li><a href="">仙女公主裙</a></li>
                            <li><a href="">BF风裤子</a></li>
                        </ul>
                    </div>
                </div>
                <div class="shopping-car">
                    <div class="content">
                        <img src="./images/car.png" alt="">
                        <div class="object">购物车物品</div>
                    </div>
                </div>
            </div>
            <div class="partTwo">
                <div class="nav">
                    <ul>
                        <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>
                        <li><a href="">客户实拍</a></li>
                    </ul>
                    <img class="new" src="./images/new.png" alt="">
                    <img class="hot" src="./images/hot.png" alt="">
                </div>
                <div class="banner">
                    <img src="./images/banner.png" alt="">
                    <div class="dialog">
                        <div class="water">
                            <div class="logo">
                                <img src="./images/icon1.png" alt="">
                            </div>
                            <div class="word">
                                <div class="title">
                                    <div>美容洗护</div>
                                    <div>></div>
                                </div>
                                <div class="list">
                                    <ul>
                                        <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>
                                        <li><a href="">洁面</a></li>
                                        <li><a href=""></a></li>
                                        <li><a href="">卫生巾</a></li>
                                        <li><a href=""></a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="water">
                            <div class="logo">
                                <img src="./images/icon1.png" alt="">
                            </div>
                            <div class="word">
                                <div class="title">
                                    <div>美容洗护</div>
                                    <div>></div>
                                </div>
                                <div class="list">
                                    <ul>
                                        <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>
                                        <li><a href="">洁面</a></li>
                                        <li><a href=""></a></li>
                                        <li><a href="">卫生巾</a></li>
                                        <li><a href=""></a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="water">
                            <div class="logo">
                                <img src="./images/icon1.png" alt="">
                            </div>
                            <div class="word">
                                <div class="title">
                                    <div>美容洗护</div>
                                    <div>></div>
                                </div>
                                <div class="list">
                                    <ul>
                                        <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>
                                        <li><a href="">洁面</a></li>
                                        <li><a href=""></a></li>
                                        <li><a href="">卫生巾</a></li>
                                        <li><a href=""></a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="water">
                            <div class="logo">
                                <img src="./images/icon1.png" alt="">
                            </div>
                            <div class="word">
                                <div class="title">
                                    <div>美容洗护</div>
                                    <div>></div>
                                </div>
                                <div class="list">
                                    <ul>
                                        <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>
                                        <li><a href="">洁面</a></li>
                                        <li><a href=""></a></li>
                                        <li><a href="">卫生巾</a></li>
                                        <li><a href=""></a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="water">
                            <div class="logo">
                                <img src="./images/icon1.png" alt="">
                            </div>
                            <div class="word">
                                <div class="title">
                                    <div>美容洗护</div>
                                    <div>></div>
                                </div>
                                <div class="list">
                                    <ul>
                                        <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>
                                        <li><a href="">洁面</a></li>
                                        <li><a href=""></a></li>
                                        <li><a href="">卫生巾</a></li>
                                        <li><a href=""></a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="water">
                            <div class="logo">
                                <img src="./images/icon1.png" alt="">
                            </div>
                            <div class="word">
                                <div class="title">
                                    <div>美容洗护</div>
                                    <div>></div>
                                </div>
                                <div class="list">
                                    <ul>
                                        <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>
                                        <li><a href="">洁面</a></li>
                                        <li><a href=""></a></li>
                                        <li><a href="">卫生巾</a></li>
                                        <li><a href=""></a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="partThree">
                <div class="container">
                    <div class="orders">
                        <div class="orders-top">
                            <div class="tit">拼单团购</div>
                        </div>
                        <div class="orders-bottom">
                            <dl>
                                <dt>
                                    <img src="./images/red.png" alt="">
                                </dt>
                                <dd>
                                    <p>美妆商彩城</p>
                                    <p>团购价：<span>￥0.00</span></p>
                                    <div class="gift">
                                        <div class="gift-left">
                                            <img src="./images/gift.png" alt="">
                                        </div>
                                        <div class="gift-right">已结束</div>
                                    </div>
                                </dd>
                            </dl>
                            <dl>
                                <dt>
                                    <img src="./images/red.png" alt="">
                                </dt>
                                <dd>
                                    <p>美妆商彩城</p>
                                    <p>团购价：<span>￥0.00</span></p>
                                    <div class="gift">
                                        <div class="gift-left">
                                            <img src="./images/gift.png" alt="">
                                        </div>
                                        <div class="gift-right">已结束</div>
                                    </div>
                                </dd>
                            </dl>
                            <dl>
                                <dt>
                                    <img src="./images/red.png" alt="">
                                </dt>
                                <dd>
                                    <p>美妆商彩城</p>
                                    <p>团购价：<span>￥0.00</span></p>
                                    <div class="gift">
                                        <div class="gift-left">
                                            <img src="./images/gift.png" alt="">
                                        </div>
                                        <div class="gift-right">已结束</div>
                                    </div>
                                </dd>
                            </dl>
                        </div>
                    </div>
                    <div class="orders">
                        <div class="orders-top">
                            <div class="tit">拼单团购</div>
                        </div>
                        <div class="orders-bottom">
                            <dl>
                                <dt>
                                    <img src="./images/red.png" alt="">
                                </dt>
                                <dd>
                                    <p>美妆商彩城</p>
                                    <p>团购价：<span>￥0.00</span></p>
                                    <div class="gift">
                                        <div class="gift-left">
                                            <img src="./images/gift.png" alt="">
                                        </div>
                                        <div class="gift-right">已结束</div>
                                    </div>
                                </dd>
                            </dl>
                            <dl>
                                <dt>
                                    <img src="./images/red.png" alt="">
                                </dt>
                                <dd>
                                    <p>美妆商彩城</p>
                                    <p>团购价：<span>￥0.00</span></p>
                                    <div class="gift">
                                        <div class="gift-left">
                                            <img src="./images/gift.png" alt="">
                                        </div>
                                        <div class="gift-right">已结束</div>
                                    </div>
                                </dd>
                            </dl>
                            <dl>
                                <dt>
                                    <img src="./images/red.png" alt="">
                                </dt>
                                <dd>
                                    <p>美妆商彩城</p>
                                    <p>团购价：<span>￥0.00</span></p>
                                    <div class="gift">
                                        <div class="gift-left">
                                            <img src="./images/gift.png" alt="">
                                        </div>
                                        <div class="gift-right">已结束</div>
                                    </div>
                                </dd>
                            </dl>
                        </div>
                    </div>
                </div>
            </div>
            <div class="partFour">
                <div class="container">
                    <div class="conFirst">
                        <div class="spa">
                            <div></div>
                            <div>
                                <p>美容洗护</p>
                                <p>Beauty care</p>
                            </div>
                            <div></div>
                        </div>
                        <div class="list">
                            <div class="new-hot">
                                <div class="tit">最热HOT</div>
                                <ul>
                                    <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>
                                    <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="">skin</a></li>
                                </ul>
                            </div>
                            <div class="other">
                                <img src="./images/woman.png" alt="">
                            </div>
                            <div class="vase">
                                <div class="vase-top">
                                    <div class="tit">
                                        <p>水乳精华</p>
                                        <p>￥1049</p>
                                        <span>￥1866</span>
                                    </div>
                                    <img src="./images/watch.png" alt="">

                                </div>
                                <div class="vase-bottom">
                                    <div class="vase-bottom-partOne">
                                        <dl class="special">
                                            <dt>
                                                <img src="./images/flower.png" alt="">
                                            </dt>
                                            <dd>
                                                <p>品牌香水</p>
                                                <p>￥355<span>￥500</span></p>
                                            </dd>
                                        </dl>
                                    </div>
                                    <div class="vase-bottom-partTwo">
                                        <dl class="special">
                                            <dt>
                                                <img src="./images/flower.png" alt="">
                                            </dt>
                                            <dd>
                                                <p>品牌香水</p>
                                                <p>￥355<span>￥500</span></p>
                                            </dd>
                                        </dl>
                                    </div>
                                </div>
                            </div>
                            <div class="tree">
                                <div class="treeTop">
                                    <dl class="special">
                                        <dt>
                                            <img src="./images/flower.png" alt="">
                                        </dt>
                                        <dd>
                                            <p>品牌香水</p>
                                            <p>￥355<span>￥500</span></p>
                                        </dd>
                                    </dl>
                                </div>
                                <div class="treeBottom">
                                    <dl class="special">
                                        <dt>
                                            <img src="./images/flower.png" alt="">
                                        </dt>
                                        <dd>
                                            <p>品牌香水</p>
                                            <p>￥355<span>￥500</span></p>
                                        </dd>
                                    </dl>
                                </div>
                            </div>
                            <div class="flower">
                                <div class="flower-top">
                                    <div class="tit">热卖品牌</div>
                                </div>
                                <div class="flower-bottom">
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="conFirst">
                        <div class="spa">
                            <div></div>
                            <div>
                                <p>美容洗护</p>
                                <p>Beauty care</p>
                            </div>
                            <div></div>
                        </div>
                        <div class="list">
                            <div class="new-hot">
                                <div class="tit">最热HOT</div>
                                <ul>
                                    <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>
                                    <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="">skin</a></li>
                                </ul>
                            </div>
                            <div class="other">
                                <img src="./images/woman.png" alt="">
                            </div>
                            <div class="vase">
                                <div class="vase-top">
                                    <div class="tit">
                                        <p>水乳精华</p>
                                        <p>￥1049</p>
                                        <span>￥1866</span>
                                    </div>
                                    <img src="./images/watch.png" alt="">

                                </div>
                                <div class="vase-bottom">
                                    <div class="vase-bottom-partOne">
                                        <dl class="special">
                                            <dt>
                                                <img src="./images/flower.png" alt="">
                                            </dt>
                                            <dd>
                                                <p>品牌香水</p>
                                                <p>￥355<span>￥500</span></p>
                                            </dd>
                                        </dl>
                                    </div>
                                    <div class="vase-bottom-partTwo">
                                        <dl class="special">
                                            <dt>
                                                <img src="./images/flower.png" alt="">
                                            </dt>
                                            <dd>
                                                <p>品牌香水</p>
                                                <p>￥355<span>￥500</span></p>
                                            </dd>
                                        </dl>
                                    </div>
                                </div>
                            </div>
                            <div class="tree">
                                <div class="treeTop">
                                    <dl class="special">
                                        <dt>
                                            <img src="./images/flower.png" alt="">
                                        </dt>
                                        <dd>
                                            <p>品牌香水</p>
                                            <p>￥355<span>￥500</span></p>
                                        </dd>
                                    </dl>
                                </div>
                                <div class="treeBottom">
                                    <dl class="special">
                                        <dt>
                                            <img src="./images/flower.png" alt="">
                                        </dt>
                                        <dd>
                                            <p>品牌香水</p>
                                            <p>￥355<span>￥500</span></p>
                                        </dd>
                                    </dl>
                                </div>
                            </div>
                            <div class="flower">
                                <div class="flower-top">
                                    <div class="tit">热卖品牌</div>
                                </div>
                                <div class="flower-bottom">
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="conFirst">
                        <div class="spa">
                            <div></div>
                            <div>
                                <p>美容洗护</p>
                                <p>Beauty care</p>
                            </div>
                            <div></div>
                        </div>
                        <div class="list">
                            <div class="new-hot">
                                <div class="tit">最热HOT</div>
                                <ul>
                                    <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>
                                    <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="">skin</a></li>
                                </ul>
                            </div>
                            <div class="other">
                                <img src="./images/woman.png" alt="">
                            </div>
                            <div class="vase">
                                <div class="vase-top">
                                    <div class="tit">
                                        <p>水乳精华</p>
                                        <p>￥1049</p>
                                        <span>￥1866</span>
                                    </div>
                                    <img src="./images/watch.png" alt="">

                                </div>
                                <div class="vase-bottom">
                                    <div class="vase-bottom-partOne">
                                        <dl class="special">
                                            <dt>
                                                <img src="./images/flower.png" alt="">
                                            </dt>
                                            <dd>
                                                <p>品牌香水</p>
                                                <p>￥355<span>￥500</span></p>
                                            </dd>
                                        </dl>
                                    </div>
                                    <div class="vase-bottom-partTwo">
                                        <dl class="special">
                                            <dt>
                                                <img src="./images/flower.png" alt="">
                                            </dt>
                                            <dd>
                                                <p>品牌香水</p>
                                                <p>￥355<span>￥500</span></p>
                                            </dd>
                                        </dl>
                                    </div>
                                </div>
                            </div>
                            <div class="tree">
                                <div class="treeTop">
                                    <dl class="special">
                                        <dt>
                                            <img src="./images/flower.png" alt="">
                                        </dt>
                                        <dd>
                                            <p>品牌香水</p>
                                            <p>￥355<span>￥500</span></p>
                                        </dd>
                                    </dl>
                                </div>
                                <div class="treeBottom">
                                    <dl class="special">
                                        <dt>
                                            <img src="./images/flower.png" alt="">
                                        </dt>
                                        <dd>
                                            <p>品牌香水</p>
                                            <p>￥355<span>￥500</span></p>
                                        </dd>
                                    </dl>
                                </div>
                            </div>
                            <div class="flower">
                                <div class="flower-top">
                                    <div class="tit">热卖品牌</div>
                                </div>
                                <div class="flower-bottom">
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                    <div class="team">
                                        <img src="./images/big.png" alt="">
                                        <div class="water">xx知名化妆品牌</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="end-Logo">
                        <div class="picture">
                            <img src="./images/big.png" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 页尾 -->
        <div class="footer"></div>
    </div>
</body>

</html>