小米商城首页所有导航作业

Original 2019-05-09 16:54:04 239
abstract://html页面 <!DOCTYPE html> <html>     <head>         <meta charset="utf-8" />   &nb
//html页面
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <link rel="stylesheet" type="text/css" href="css/base.css"/>
        <link rel="stylesheet" type="text/css" href="css/style.css"/>
        <link rel="stylesheet" type="text/css" href="font-awesome/css/font-awesome.min.css">
    </head>
    <body>
        <header>
            <section class="header_title">
                <div class="main">
                    <div class="fl">
                        <a href="#">小米商城</a>
                        <em>|</em>
                        <a href="#">MIUI</a>
                        <em>|</em>
                        <a href="#">IOT</a>
                        <em>|</em>
                        <a href="#">云服务</a>
                        <em>|</em>
                        <a href="#">小爱分享平台</a>
                        <em>|</em>
                        <a href="#">金融</a>
                        <em>|</em>
                        <a href="#">有品</a>
                        <em>|</em>
                        <a href="#">企业服务</a>
                        <em>|</em>
                        <a href="#">SelectRegion</a>
                        
                    </div>
                    <div class="fr">
                        <a href="#">登录</a>
                        <em>|</em>
                        <a href="#">注册</a>
                        <em>|</em>
                        <a href="#">我的订单</a>
                    
                        <span>
                            <i class="fa fa-shopping-cart"></i>
                            购物车(0)
                            <div class="gwbox">暂时还没有商品</div>
                        </span>
                    </div>
                </div>
                
                </div>
            </section>
            <div class="clear"></div>
            <!-- 头部顶部结束 -->
            <nav class="main">
                <div class="fl">
                    <img src="img/footlogo.png" />
                    <img src="img/logoAD.gif" />
                </div>
                <ul>
                    <li><a href="#">小米手机</a>
                        <div class="header_dl">
                            <dl class="main">
                                <dd>
                                    <p><span class="new">新品</span></p>
                                    <img src="img/phone/phone1.png" >
                                    <p class="f_cs">小米2s</p>
                                    <p class="f_hs">39200元</p>
                                </dd>
                                <dd>
                                    <p><span class="new">新品</span></p>
                                    <img src="img/phone/phone1.png" >
                                    <p class="f_cs">小米2s</p>
                                    <p class="f_hs">39200元</p>
                                </dd>
                                <dd>
                                    <p><span class="new">新品</span></p>
                                    <img src="img/phone/phone1.png" >
                                    <p class="f_cs">小米2s</p>
                                    <p class="f_hs">39200元</p>
                                </dd>
                                <dd>
                                    <p><span class="new">新品</span></p>
                                    <img src="img/phone/phone1.png" >
                                    <p class="f_cs">小米2s</p>
                                    <p class="f_hs">39200元</p>
                                </dd>
                            </dl>
                        </div>
                    </li>
                    <li><a href="#">红米</a></li>
                    <li><a href="#">电视</a></li>
                    <li><a href="#">笔记本</a></li>
                    <li><a href="#">盒子</a>
                        <div class="header_dl">
                            <dl class="main">
                                <dd>
                                    <p><span class="new">新品</span></p>
                                    <img src="img/phone/phone1.png" >
                                    <p class="f_cs">小米2s</p>
                                    <p class="f_hs">39200元</p>
                                </dd>
                                <dd>
                                    <p><span class="new">新品</span></p>
                                    <img src="img/phone/phone1.png" >
                                    <p class="f_cs">小米2s</p>
                                    <p class="f_hs">39200元</p>
                                </dd>
                                <dd>
                                    <p><span class="new">新品</span></p>
                                    <img src="img/phone/phone1.png" >
                                    <p class="f_cs">小米2s</p>
                                    <p class="f_hs">39200元</p>
                                </dd>
                                <dd>
                                    <p><span class="new">新品</span></p>
                                    <img src="img/phone/phone1.png" >
                                    <p class="f_cs">小米2s</p>
                                    <p class="f_hs">39200元</p>
                                </dd>
                            </dl>
                        </div>
                    </li>
                    <li><a href="#">新品</a></li>
                    <li><a href="#">路由器</a></li>
                    <li><a href="#">智能硬件</a></li>
                    <li><a href="#">服务</a>
                        <div class="header_dl">
                            <dl class="main">
                                <dd>
                                    <p><span class="new">新品</span></p>
                                    <img src="img/phone/phone1.png" >
                                    <p class="f_cs">小米2s</p>
                                    <p class="f_hs">39200元</p>
                                </dd>
                                <dd>
                                    <p><span class="new">新品</span></p>
                                    <img src="img/phone/phone1.png" >
                                    <p class="f_cs">小米2s</p>
                                    <p class="f_hs">39200元</p>
                                </dd>
                                <dd>
                                    <p><span class="new">新品</span></p>
                                    <img src="img/phone/phone1.png" >
                                    <p class="f_cs">小米2s</p>
                                    <p class="f_hs">39200元</p>
                                </dd>
                                <dd>
                                    <p><span class="new">新品</span></p>
                                    <img src="img/phone/phone1.png" >
                                    <p class="f_cs">小米2s</p>
                                    <p class="f_hs">39200元</p>
                                </dd>
                            </dl>
                        </div>
                    </li>
                    <li><a href="#">社区</a></li>
                </ul>
                <div class="fr">
                    <form>
                        <input type="text" placeholder="点击输入搜索内容" />
                        <button><i class="fa fa-search"></i></button>
                    </form>
                </div>
            </nav>
            <div class="clear"></div>
        </header>
        <!-- 头部结束 -->
        
        <section class="content">
            <div class="main">
                <div class="nav_box">
                    <ul class="fl">
                        <li>
                            <a href="">手机电话卡</a>
                            <i class="fa fa-angle-right"></i>
                            <dl class="nav_box_dl">
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                
                            </dl>
                        </li>
                        <li>
                            <a href="">手机电/话卡</a>
                            <i class="fa fa-angle-right"></i>
                        </li>
                        <li>
                            <a href="">电视机/盒子</a>
                            <i class="fa fa-angle-right"></i>
                            <dl class="nav_box_dl">
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
                                <dd><img src="img/phone/phone1.png"/>红米6A</dd>
               &					

Correcting teacher:查无此人Correction time:2019-05-10 14:15:41
Teacher's summary:完成的不错。代码复制不完整,可以截图上传。继续加油。

Release Notes

Popular Entries