WEB前端-CSS-静态购物页面V1

59 阅读 0 评论 39 点赞
我是靠谱客的博主听话背包，最近开发中收集的这篇文章主要介绍WEB前端-CSS-静态购物页面V1，觉得挺不错的，现在分享给大家，希望可以做个参考。
概述

使用html&css实现了一个购物的静态页面，css样式仅供参考
以下为页面结构图
页面架构图 css 图层 web html top
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" http-equiv="X-UA-COMPATIBLE" content="IE=edge"/>
    <meta http-equiv="refresh" Content="300"/>
    <meta name="keywords" content="shopping_car"/>
    <title>MyShopCar</title>
    <link rel="shortcut icon" href="p3.png"/>
    <!--css start-->
    <style type="text/css">
        /*返回顶部*/
        .b3_backtotop {
            border:2px solid burlywood;
            width:50px;
            height:50px;
            font-size:24px;
            color:blanchedalmond;
            position:fixed;
            bottom:10px;
            left:90%;
            background-image:url(http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3D8a7e333a43166d223877159c76220945%2Fe9e336d3d539b600e576bb46e950352ac75cb7b1.jpg&thumburl=http%3A%2F%2Fimg1.imgtn.bdimg.com%2Fit%2Fu%3D1974011879%2C1336495790%26fm%3D21%26gp%3D0.jpg);
            background-position:-107px -90px;
            cursor:pointer;
        }
        /*背景*/
        .b4{
            background:#fff;
            width:100%;
            height:3000px;
            clear:both;
        }
        /*顶部项目区*/
        .b5_top{
            width:100%;
            height:240px;
        }
        .b5_top .b5_top_target{
            margin-top:0px;
            margin-left:0px;
            height:30px;
            line-height:30px;
            background-color:#F1F1F1;
            font-size:14px;
            clear:both;
        }
        .b5_top .b5_top_target .b5_top_target_left{
            margin-left:30px;
            width:90px;
            height:30px;
            line-height:30px;
            float:left;
            cursor:pointer;
        }
        .b5_top .b5_top_target .b5_top_target_right{
            padding-right:300px;
            width:60%;
            height:30px;
            float:right;
        }
        ul{
            margin:0;
            list-style-type:none;
        }
        .b5_top .b5_top_target .b5_top_target_right .b5_top_target_right_tip{
            line-height:30px;
            border-left:1px dashed gray;
            border-right:1px dashed gray;
            padding:0 14px 0 14px;
            cursor:pointer;
            float:right;
        }
        .b5_top .b5_top_target .b5_top_target_right .b5_top_target_right_tip:hover{
            background-color:snow;
        }
        .b5_top_display{
            width: 100%;
            background:url(http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fp3.gexing.com%2FG1%2FM00%2FCE%2F15%2FrBACFFKUV3zwxtFiAAY9um227e0611.jpg&thumburl=http%3A%2F%2Fimg5.imgtn.bdimg.com%2Fit%2Fu%3D37066705%2C642523342%26fm%3D21%26gp%3D0.jpg);
            background-position:100% -250px;
            height:70px;
        }
        .b5_top_display_content{
            margin-left:20%;
            padding:10px 30px 10px 30px;
            height:40px;
            width:800px;
            font-size:40px;
            font-weight:800;
            color:black;
            float:left;
        }
        .b5_top_search{
            padding:0 0px 0 0px;
            width:100%;
            height:150px;
            background-color:#fff;
            float:left;
        }
        .b5_top_search .b5_top_search_logo{
            float:left;
            margin-left:10%;
            width:240px;
            height:150px;
            background:url(http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fp3.gexing.com%2Ftouxiang%2F20121211%2F1456%2F50c6d91119b0e_200x200_3.jpg&thumburl=http%3A%2F%2Fimg1.imgtn.bdimg.com%2Fit%2Fu%3D1058562824%2C3247128813%26fm%3D21%26gp%3D0.jpg) no-repeat;
            cursor:pointer;
        }
        .b5_top_search .b5_top_search_search{
            margin-left:5%;
            float:left;
            width:540px;
            height:150px;
        }
        .b5_top_search .b5_top_search_search .b5_top_search_search_button{
            border:1px solid darkred;
            line-height:34px;
            width:80px;
            background-color:darkred;
            font-size:21px;
            font-family:微软雅黑;
            font-weight:700;
            color:white;
            float:right;
            cursor:pointer;
        }
        .b5_top_search .b5_top_search_search .b5_top_search_search_search{
            height: 30px;
            width:450px;
            float:left;
        }
        .b5_top_search .b5_top_search_note{
            margin:0;
            width:450px;
            height:30px;
        }
        .b5_top_search .b5_top_search_note .b5_top_search_note_ul{
            margin:0;
            list-style-type: none;
        }
        .b5_top_search .b5_top_search_note .b5_top_search_note_ul .b5_top_search_note_li{
            padding:0 8px 0 8px;
            border-right:1px dashed grey;
            font-size:12px;
            font-weight:300;
            color:gray;
            float:left;
        }
        .b5_top_search .b5_top_search_note .b5_top_search_note_ul .b5_top_search_note_li:hover{
            color:red;
            cursor:pointer;
        }
        .b5_top_search .b5_top_search_shoppingcar{
            border:1px solid grey;
            margin-top:60px;
            margin-left:9%;
            width:141px;
            height:45px;
            background-image:url(http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Ft1.ituba.cc%2Fmm8%2Ftupai%2F20150909%2F211932514.jpg&thumburl=http%3A%2F%2Fimg3.imgtn.bdimg.com%2Fit%2Fu%3D3180836057%2C1724796458%26fm%3D21%26gp%3D0.jpg);
            background-position:-46px 180px;
            float:left;
            cursor:pointer;
        }
        /*中部导航区*/
        .b2_menu{
            width:100%;
            background-color:#fff;
            border-bottom:3px solid #B1191A;
            height:44px;
        }
        .b2_menu .b2_menu_left{
            margin-left:10%;
            padding:8px 20px 2px 20px;
            height:34px;
            width:200px;
            font-size:18px;
            font-weight:500;
            color:#fff;
            font-family: "Microsoft YaHei",tahoma,arial,"Hiragino Sans GB","5b8b4f53",sans-serif;
            background-color:#B1191A;
            cursor:pointer;
            float:left;
        }
        .b2_menu .b2_menu_right{
            width:800px;
            height:44px;
            float:left;
        }
        .b2_menu .b2_menu_right .b2_menu_right_li{
            padding:10px 10px 10px 10px;
            width:100px;
            height:24px;
            font-size:16px;
            font-weight:400;
            font-family: "Microsoft YaHei",tahoma,arial,"Hiragino Sans GB","5b8b4f53",sans-serif;
            float:left;
        }
        .b2_menu .b2_menu_right .b2_menu_right_li:hover{
            color:#B1191A;
            cursor:pointer;
            height:16px;
            border-right:1px dashed gray;
        }
        /*左边菜单区*/
        .b5_left{
            margin-left:10%;
            width:238px;
            height:480px;
            float:left;
            background-color:#cc2954;
            border:1px solid #cc2954;
        }
        .b5_left .b5_left_menu{
            padding:10px 10px 10px 20px;
            width:210px;
            height:60px;
            font-size:16px;
            font-weight:400;
            font-family: "Microsoft YaHei",tahoma,arial,"Hiragino Sans GB","5b8b4f53",sans-serif;
            color:#fff;
            cursor:pointer;
        }
        .b5_left .b5_left_menu:hover{
            background-color:#fff;
            color:#cc2954;
            font-size:18px;
            font-weight:400;
            font-family: "Microsoft YaHei",tahoma,arial,"Hiragino Sans GB","5b8b4f53",sans-serif;
            border-bottom:1px dashed gainsboro;
        }
        /*中间主要内容展示区*/
        .b5_content{
            width:65%;
            height:1600px;
            float:left;
            background-color:lightgoldenrodyellow;
        }
        .b5_bottom table{
            height:1500px;
            width:60%;
            border:1px dashed gray;
            padding:3px 10px 3px 10px;
        }
        .b5_content table tbody tr td{
            padding:2px 10px 2px 10px;
            height: 250px;
            cursor:pointer;
        }
        .b5_content table tbody tr td div{
            padding:1px 10px 1px 8px;
            height:30px;
            weight:180px;
            font-size:14px;
            font-weight:400;
            font-family: "Microsoft YaHei",tahoma,arial,"Hiragino Sans GB","5b8b4f53",sans-serif;
            list-style-type: none;
        }
        .b5_content table tbody tr td:hover{
            color:#B1191A;
            border-bottom:1px solid #B1191A;
        }
        /*底部版权声明等区域*/
        .b5_bottom{
            margin-left:15%;
            width:100%;
            height:150px;
            background-color:#fff;
            float:left;
        }
        .b5_bottom table{
            height:100px;
            width:80%;
            border:1px dashed gray;
            padding:20px 30px 20px 30px;
        }
        .b5_bottom table thead tr td{
            padding:0 5% 0 5%;
            line-height: 25px;
            height:24px;
            font-size:14px;
            font-weight:400;
            font-family: "Microsoft YaHei",tahoma,arial,"Hiragino Sans GB","5b8b4f53",sans-serif;
        }
        .b5_bottom table tbody tr td{
            padding:0 5% 0 5%;
            line-height: 25px;
            height:24px;
            font-size:14px;
            font-weight:400;
            font-family: "Microsoft YaHei",tahoma,arial,"Hiragino Sans GB","5b8b4f53",sans-serif;
            cursor:pointer;
        }
        .b5_bottom table tbody tr td:hover{
            color:#B1191A;
            border-bottom:1px solid #B1191A;
        }
    </style>
    <!--css end-->
    <script type="text/javascript"></script>
</head>
<body class="b4">
        <!--顶部展示区-->
        <div class="b5_top">
            <!--最上层标签-->
            <div id="top" class="b5_top_target">
                <div class="b5_top_target_left">
                    送至
                    <select>
                        <option>北京</option>
                        <option>上海</option>
                        <option>南京</option>
                        <option>武汉</option>
                        <option>成都</option>
                        <option>西安</option>
                        <option>广州</option>
                        <option>深圳</option>
                        <option>天津</option>
                    </select>
                </div>
                <div class="b5_top_target_right">
                    <ul>
                        <li class="b5_top_target_right_tip">最新活动</li>
                        <li class="b5_top_target_right_tip">我的账户</li>
                        <li class="b5_top_target_right_tip">我的订单</li>
                        <li class="b5_top_target_right_tip">掌上购物</li>
                        <li class="b5_top_target_right_tip">免费注册</li>
                        <li class="b5_top_target_right_tip">你好，请登录</li>
                    </ul>
                </div>
            </div>
            <!--中部广告展示区-->
            <div class="b5_top_display">
                <div class="b5_top_display_content">更成熟的互联网行业正在成型，来一起见证</div>
            </div>
            <!--底部搜索栏-->
            <div class="b5_top_search">
                <div class="b5_top_search_logo"></div>
                <div class="b5_top_search_search">
                    <form>
                        <div style="border:3px solid darkred;height:35px;margin-top:60px;">
                            <input type="text" name="特斯拉" class="b5_top_search_search_search"/>
                            <input type="submit" name="搜索" value="搜索" class="b5_top_search_search_button"/>
                        </div>
                        <div class="b5_top_search_note">
                            <ul class="b5_top_search_note_ul">
                                <li class="b5_top_search_note_li">热门搜索:</li>
                                <li class="b5_top_search_note_li">Eric</li>
                                <li class="b5_top_search_note_li">Allen</li>
                                <li class="b5_top_search_note_li">Meta</li>
                                <li class="b5_top_search_note_li">Natasha</li>
                                <li class="b5_top_search_note_li">Oldboy</li>
                                <li class="b5_top_search_note_li">Lee</li>
                                <li class="b5_top_search_note_li">Jacky</li>
                            </ul>
                        </div>
                    </form>
                </div>
                <div class="b5_top_search_shoppingcar"></div>
            </div>
        </div>
        <!--导航标签-->
        <div class="b2_menu">
            <div class="b2_menu_left">全部课程分类</div>
            <div class="b2_menu_right">
                    <a class="b2_menu_right_li">Python脱产</a>
                    <a class="b2_menu_right_li">Web前端</a>
                    <a class="b2_menu_right_li">运维开发</a>
                    <a class="b2_menu_right_li">全栈开发</a>
                    <a class="b2_menu_right_li">Linux基础</a>
                    <a class="b2_menu_right_li">PHP开发</a>
            </div>
        </div>
        <!--左侧菜单展示区-->
        <div class="b5_left">
            <div class="b5_left_menu">大数据 &rsaquo;</div>
            <div class="b5_left_menu">云计算 &rsaquo;</div>
            <div class="b5_left_menu">高度自动化 &rsaquo;</div>
            <div class="b5_left_menu">应用层 &rsaquo;</div>
            <div class="b5_left_menu">更高的入行门槛 &rsaquo;</div>
            <div class="b5_left_menu">压缩的人员需求 &rsaquo;</div>
        </div>
        <!--主展示区-->
        <div class="b5_content">
            <div>
                <table>
                    <tbody>
                        <tr>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                            <td>
                                <img src="http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fw%253D580%2Fsign%3Dc6b88ba1ca8065387beaa41ba7dfa115%2Fcf1b9d16fdfaaf51a6758f508c5494eef11f7a4e.jpg&thumburl=http%3A%2F%2Fimg2.imgtn.bdimg.com%2Fit%2Fu%3D1916061380%2C2771434036%26fm%3D21%26gp%3D0.jpg"/>
                                <div>
                                    <li>&yen;18888</li>
                                    <li>评论:2888</li>
                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <!--返回顶部-->
        <a href="#top" class="b3_backtotop">
        </a>
        <!--底部展示区-->
        <div class="b5_bottom">
            <div>
                <table>
                    <thead>
                        <tr>
                            <td>购物指南</td>
                            <td>配送方式</td>
                            <td>支付方式</td>
                            <td>售后服务</td>
                            <td>特色服务</td>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>购物流程</td>
                            <td>上门自提</td>
                            <td>货到付款</td>
                            <td>售后政策</td>
                            <td>夺宝岛  </td>
                        </tr>
                        <tr>
                            <td>会员介绍</td>
                            <td>2111限时</td>
                            <td>在线支付</td>
                            <td>价格保护</td>
                            <td>上门装机</td>
                        </tr>
                        <tr>
                            <td>生活旅行</td>
                            <td>配送查询</td>
                            <td>分期付款</td>
                            <td>退款说明</td>
                            <td>延保服务</td>
                        </tr>
                        <tr>
                            <td>常见问题</td>
                            <td>收费标准</td>
                            <td>邮局汇款</td>
                            <td>返修换货</td>
                            <td>京东EA卡</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
</body>
</html>