master

分支 (1)

管理

管理

master

leishen
/
index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/index.css">

</head>
<body>

<!--header HTML5中的新标签 代表头部-->
<header>
    <!--container 容器-->
    <!--top_nav 顶部导航-->
    <nav class="container top_nav clear">
        <ul class="left_nav clear">
            <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 class="code">
                <a href="">商城移动版</a>
                <img src="images/yidong.png" alt="">
            </li>
            <li><a href="">企业订购</a></li>
            <li><a href="">问题反馈</a></li>
        </ul>
        <ul class="right_nav clear">
            <li><a href="">签到赢好礼</a></li>
            <li><a href="">登录</a></li>
            <li><a href="">注册</a></li>
            <li class="car_item">
                <a href="">
                <img src="images/car.png" alt="">
                <span> 购物车</span>
                <span>(0)</span>
            </a>
            </li>
            <li class="car_content">购物车中还没有商品，赶紧选购吧！</li>
        </ul>
    </nav>
</header>

<!--search_contener搜索部分-->
<!--container 之前设置的版心-->
<div class="search_contener container clear">
    <!--logo部分-->
    <div class="left_logo">
        <!--行内元素 水平方向排列-->
        <img src="images/logozui.jpg" alt="logo">
        <img src="images/1512442299696805532.gif
" alt="">
    </div>
    <!--搜索部分-->
    <div class="right_search">
        <input type="text">
        <a>
            <!--<img src="images/search.png" alt="">-->
        </a>
        <ul class="histroy clear">
            <li>Y6</li>
            <li>Dino</li>
            <li>黑武士</li>
        </ul>
    </div>
</div>

<!--导航部分-->
<div class="nav_container">
    <ul class="nav container clear">
        <li class="all_types"><span>全部分类</span><span>▼</span>
        <ul class="detail_types">
            <li><a href=""><span>游戏笔记本</span><span>></span></a>
                <ul class="detail_info">
                    <li><img src="images/info.jpg" alt="" height="30px"><span>雷神911豪华版</span></li>
                    <li><img src="images/info.jpg" alt="" height="30px"><span>雷神911豪华版</span></li>
                    <li><img src="images/info.jpg" alt="" height="30px"><span>雷神911豪华版</span></li>
                    <li><img src="images/info.jpg" alt="" height="30px"><span>雷神911豪华版</span></li>
                    <li><img src="images/info.jpg" alt="" height="30px"><span>雷神911豪华版</span></li>
                </ul>
            </li>
            <li><a href=""><span>游戏笔记本</span><span>></span></a></li>
            <li><a href=""><span>游戏笔记本</span><span>></span></a></li>
            <li><a href=""><span>游戏笔记本</span><span>></span></a></li>
            <li><a href=""><span>游戏笔记本</span><span>></span></a></li>
            <li><a href=""><span>游戏笔记本</span><span>></span></a></li>
            <li><a href=""><span>游戏笔记本</span><span>></span></a></li>
        </ul>

        </li>
        <li>
            <a href="">911系列</a>
            <div class="detail">
                <ul class="detail_list container clear">
                    <li>
                    <img src="images/415_thumb_G_1512676895384.jpg" alt="">
                    <p>雷神911GT-Y6</p>
                    <p>10999.0</p>
                </li>
                    <li>
                    <img src="images/415_thumb_G_1512676895384.jpg" alt="">
                    <p>雷神911GT-Y6</p>
                    <p>10999.0</p>
                </li>
                    <li>
                        <img src="images/415_thumb_G_1512676895384.jpg" alt="">
                        <p>雷神911GT-Y6</p>
                        <p>10999.0</p>
                    </li>
                    <li>
                        <img src="images/415_thumb_G_1512676895384.jpg" alt="">
                        <p>雷神911GT-Y6</p>
                        <p>10999.0</p>
                    </li>
                    <li>
                        <img src="images/415_thumb_G_1512676895384.jpg" alt="">
                        <p>雷神911GT-Y6</p>
                        <p>10999.0</p>
                    </li>
                    <li>
                        <img src="images/415_thumb_G_1512676895384.jpg" alt="">
                        <p>雷神911GT-Y6</p>
                        <p>10999.0</p>
                    </li>
                </ul>
            </div>
        </li>
        <li><a href="">ST系列</a></li>
        <li><a href="">Dino系列</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 class="banner">
    <!--左右侧按钮-->
    <span class="left_button"><</span>
    <span class="right_button">></span>
    <!--小圆点-->
    <ul class="pointer clear">
        <li></li>
        <li class="action"></li>
        <li></li>
    </ul>
</div>

<!--hot 火热 热门 -->
<!--product 产品-->
<!--news 新闻-->
<!--des详细信息的缩写-->
<div class="hot_product_container">
    <div class="container">
        <div class="top_news clear">
            <ul class="news_des">
                <li><a href="">
                    <img src="images/liwu1.png" alt="">
                    <span>企业团购</span>
                </a></li>
                <li><a href="">
                    <img src="images/sctb2.png" alt="">
                    <span>驱动下载</span>
                </a></li>
                <li><a href="">
                    <img src="images/sctb3.png" alt="">
                    <span>标准服务</span>
                </a></li>
                <li><a href="">
                    <img src="images/sctb4.png" alt="">
                    <span>售后网点</span>
                </a></li>
            </ul>
            <div>
                <img src="images/1505522691694425582.jpg" alt="">
            </div>
            <div>
                <img src="images/1510688667271370293.jpg" alt="">
            </div>
            <dl class="news">
                <dt>
                    <span>雷神快报</span>
                    <span>更多</span>
                </dt>
                <dd><span>【新闻】</span><span>12.12年终盛典 最后的狂欢</span></dd>
                <dd><span>【新闻】</span><span>12.12年终盛典 最后的狂欢</span></dd>
                <dd><span>【新闻】</span><span>12.12年终盛典 最后的狂欢</span></dd>
                <dd><span>【新闻】</span><span>12.12年终盛典 最后的狂欢</span></dd>
                <dd><span>【新闻】</span><span>12.12年终盛典 最后的狂欢</span></dd>
            </dl>
        </div>
        <div class="bottom_hot_product">
            <dl class="clear">
                <dt class="clear">
                    <h3>热卖单品推荐</h3>
                    <p>
                        <a href=""><</a>
                        <a href="">></a>
                    </p>
                </dt>
                <!--first：第一 -->
                <!--item：元素 -->
                <dd class="first_item">
                    <img src="images/473_thumb_G_1498614281365.jpg" alt="">
                    <p>雷神TRG A707游戏台式主机</p>
                    <p>加999元送送价值1999元的雷神幻</p>
                </dd>
                <dd>
                    <img src="images/473_thumb_G_1498614281365.jpg" alt="">
                    <p>雷神TRG A707游戏台式主机</p>
                    <p>加999元送送价值1999元的雷神幻</p>
                </dd>
                <dd>
                    <img src="images/473_thumb_G_1498614281365.jpg" alt="">
                    <p>雷神TRG A707游戏台式主机</p>
                    <p>加999元送送价值1999元的雷神幻</p>
                </dd>
                <dd>
                    <img src="images/473_thumb_G_1498614281365.jpg" alt="">
                    <p>雷神TRG A707游戏台式主机</p>
                    <p>加999元送送价值1999元的雷神幻</p>
                </dd>
                <dd>
                    <img src="images/473_thumb_G_1498614281365.jpg" alt="">
                    <p>雷神TRG A707游戏台式主机</p>
                    <p>加999元送送价值1999元的雷神幻</p>
                </dd>
            </dl>
        </div>
    </div>
</div>

<div class="product_container">
    <div class="container">

        <!--游戏笔记本-->
        <div class="game_computer clear">
            <div class="top_title clear">
                <p>游戏笔记本</p>
                <ul class="clear">
                    <li><a href="">热门</a></li>
                    <li><a href="">911系列</a></li>
                    <li><a href="">Dino系列</a></li>
                    <li><a href="">ST系列</a></li>
                    <li><a href="">办公游戏本</a></li>
                    <li><a href="">查看全部<span>></span></a></li>
                </ul>
            </div>
            <div class="left_content"></div>
            <div class="right_content">
                <ul class="clear">
                    <li>
                        <img src="images/415_thumb_G_1512676895384.jpg" alt="">
                        <p>雷神911GT-Y6</p>
                        <p>10999.0</p>
                        <p class="comment">很好！</p>
                    </li>
                    <li>
                        <img src="images/415_thumb_G_1512676895384.jpg" alt="">
                        <p>雷神911GT-Y6</p>
                        <p>10999.0</p>
                    </li>
                    <li>
                        <img src="images/415_thumb_G_1512676895384.jpg" alt="">
                        <p>雷神911GT-Y6</p>
                        <p>10999.0</p>
                    </li>
                    <li>
                        <img src="images/415_thumb_G_1512676895384.jpg" alt="">
                        <p>雷神911GT-Y6</p>
                        <p>10999.0</p>
                    </li>
                    <li>
                        <img src="images/415_thumb_G_1512676895384.jpg" alt="">
                        <p>雷神911GT-Y6</p>
                        <p>10999.0</p>
                    </li>
                    <li>
                        <img src="images/415_thumb_G_1512676895384.jpg" alt="">
                        <p>雷神911GT-Y6</p>
                        <p>10999.0</p>
                    </li>
                </ul>
            </div>
        </div>

    </div>
</div>

<footer>
    <!--广告-->
    <div class="adr"></div>
    <!--服务-->
    <div class="service container">
        <ul class="clear">
            <li><a href="">1年免费保修</a></li>
            <li><a href="">7天无理由退货</a></li>
            <li><a href="">15天免费换货</a></li>
            <li><a href="">顺丰包邮</a></li>
            <li><a href="" class="last">130余家售后网点</a></li>
        </ul>
    </div>
    <!--关于我们-->
    <div class="about_us container clear">
        <dl class="clear">
            <dd>
                <h3>帮助中心</h3>
                <ul>
                    <li><a href="">购物指南</a></li>
                    <li><a href="">支付方式</a></li>
                    <li><a href="">配送方式</a></li>
                </ul>
            </dd>
            <dd>
                <h3>帮助中心</h3>
                <ul>
                    <li><a href="">购物指南</a></li>
                    <li><a href="">支付方式</a></li>
                    <li><a href="">配送方式</a></li>
                </ul>
            </dd>
            <dd>
                <h3>帮助中心</h3>
                <ul>
                    <li><a href="">购物指南</a></li>
                    <li><a href="">支付方式</a></li>
                    <li><a href="">配送方式</a></li>
                </ul>
            </dd>
            <dd>
                <h3>帮助中心</h3>
                <ul>
                    <li><a href="">购物指南</a></li>
                    <li><a href="">支付方式</a></li>
                    <li><a href="">配送方式</a></li>
                </ul>
            </dd>
            <dd>
                <h3>帮助中心</h3>
                <ul>
                    <li><a href="">购物指南</a></li>
                    <li><a href="">支付方式</a></li>
                    <li><a href="">配送方式</a></li>
                </ul>
            </dd>
            <dd>
                <h3>新浪微博</h3>
                <img src="images/xinlang.jpg" alt="">
            </dd>
            <dd>
                <h3>雷神订阅号</h3>
                <img src="images/xinlang.jpg" alt="">
            </dd>
        </dl>
        <div>
            <p>4006-999-999</p>
            <p class="time">周一至周日 8:00-18:00</p>
            <a href="">24小时在线客服</a>
        </div>
    </div>
    <!--版权-->
    <div class="copyright">
        <div class="container clear">
            <a href="">© 2014-2017 www.leishen.cn 青岛雷神科技股份有限公司 版权所有 全国免费咨询电话：4006-999-999 鲁ICP备14015908号-1</a>
            <p>
                <img src="images/sm_124x47.png" alt="" height="25px">
                <img src="images/stat.png" alt="" height="25px">
                <img src="images/yingye.jpg" alt="" height="25px">
            </p>
        </div>
    </div>
</footer>

</body>
</html>