master

分支 (1)

管理

管理

master

iphone
/
index-内容区域骨架.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/06-index.css">
</head>
<body>
<!--顶部-->
<div class="header">
    <!--版心-->
    <div class="header_in">
        <div class="header_logo">
            <img src="img/iphone-logo.png">
        </div>
        <div class="header_nav">
            <ul class="header_nav_left">
                <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>
            <ul class="header_nav_right">
                <li><a href="#">登陆</a></li>
                <li><a href="#">注册</a></li>
                <li></li>
            </ul>
        </div>

    </div>
</div>
<div class="nav">
    <div class="nav_in">
        <ul>
            <li><a href="#">
                <img src="img/nav-phone1.png" alt="">
                <p>iPhone 12 Pro <span style="color: red">新款</span></p>
            </a></li>
            <li><a href="#">
                <img src="img/nav-phone2.png" alt="">
                <p>iPhone 12 <span style="color: red">新款</span></p>
            </a></li>
            <li><a href="#">
                <img src="img/nav-phone3.png" alt="">
                <p>iPhone SE </p>
            </a></li>
            <li><a href="#">
                <img src="img/nav-phone4.png" alt="">
                <p>iPhone 11 </p>
            </a></li>
            <li><a href="#">
                <img src="img/nav-phone5.png" alt="">
                <p>iPhone XR </p>
            </a></li>
            <li><a href="#">
                <img src="img/nav-phone6.png" alt="">
                <p>机型比较 </p>
            </a></li>
            <li><a href="#">
                <img src="img/nav-phone7.png" alt="">
                <p>AirPods </p>
            </a></li>

        </ul>
    </div>
</div>
<!--广告-->
<div class="banner">
    <div class="banner_img">
        <a href="#">
            <img src="img/guanggaoimg.png" alt="">
        </a>
    </div>
        <div class="banner_video">
            <ul>
                <li><a href="#">
                    <img src="img/video-01.png" class="big_img">
                    <div class="banner_video_info">
                        <img src="img/nb-pro-video-ico-s.png" alt="">
                        <h3>iPhone 12</h3>
                        <p>产品视频</p>
                    </div>
                </a></li>
                <li><a href="#">
                    <img src="img/video-02.png" alt="">
                </a></li>
                <li><a href="#">
                    <img src="img/video-03.png" alt="">
                </a></li>
            </ul>
        </div>
</div>
<!--内容-->
<div class="content">
    <div class="content_in">
        <dl>
            <dt>
            <h3>最新产品</h3>
            <p>查看全部收集 &gt;</p>
            </dt>
            <dd class="content_mobiles">
                <ul>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
            </dd>
            <dt>
            <h3>精选配件</h3>
            <p>查看全部配件 &gt;</p>
            </dt>
            <dd class="content_accessories">
                <ul>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
            </dd>
        </dl>
    </div>
</div>
<!--底部-->
<div class="footer"></div>

</body>
</html>