<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="user-scalable=no,width=device-width,initial-scale=1.0,maximum-scale=1.0">
    <title>响应式网页设计</title>
    <link rel="stylesheet" href="ccmain.css" type="text/css">
</head>
<body>
<header>
    <section class="container">
        <div class="logo"><img src="logo.png"></div>
        <nav><input type="checkbox" id="togglebox">
            <ul>
                <li><a href="">首页</a></li>
                <li><a href="">合作经营</a></li>
                <li><a href="">COCO饮品</a></li>
                <li><a href="">伙伴招募</a></li>
                <li><a href="">服务中心</a></li>
            </ul>
            <label class="menu" for="togglebox"><img src="menu.png"></label>
        </nav>
        <div class="clearfix"></div>
    </section>
</header>
<section class="banner">
    <section class="image" id="img">
        <div><img src="banner1.jpg" alt=""></div>
        <div><img src="banner2.jpg" alt=""></div>
        <div><img src="banner3.jpg" alt=""></div>
    </section>
</section>
<section class="main">
    <div class="container"><h3>最新消息</h3></div>
    <section>
        <div class="num1"><img src="num1.jpg" alt=""><p>咖啡里竟然有迷人花果香</p></div>
        <div class="num2"><img src="num2.jpg" alt=""><p>跟着CoCo去旅行斯里兰卡</p></div>
        <div class="num3"><img src="num3.png" alt=""><p>用心制作的茶饮 带来愉快的享受</p></div>
        <div class="num4"><img src="num4.jpg" alt=""><p>跟着CoCo去旅行安溪</p></div>
    </section>
</section>
<footer>
    <section>
        <p>Copyright © 2020 OCOCO International Co., Ltd.</p>
    </section>
</footer>
</body>
<script src="cc.js"></script>
</html>
