css：

* {

    padding: 0;

    margin: 0;

}

ul,ol {

    list-style: none;

}

a {

    text-decoration: none;

}

header {

    background-color: #07cbc9;

    height: 80px;

}

header .box {

    width: 1200px;

    margin: 0 auto;

}

header .box .logo {

    float: left;

    padding-top: 16px;

}

header .box nav {

    float: right;

}

header .box nav ul li {

    float: left;

}

header .box nav ul li a {

    font-style: 16px;

    color: white;

    margin-right: 20px;

    line-height: 80px;

}

html的header部分：

    <!-- Header区域 -->

    <header>

        <div class="box">

            <!-- Logo部分 -->

            <div class="logo">

                <img src="images/logo.png" alt="">

            </div>

            <!-- 导航部分 -->

            <nav>

                <ul>

                    <li><a href="">HOME</a></li>

                    <li><a href="">ABOUT</a></li>

                    <li><a href="">GALLERY</a></li>

                    <li><a href="">FACULTY</a></li>

                    <li><a href="">EVENTS</a></li>

                    <li><a href="">CONTACT</a></li>

                </ul>

            </nav>

        </div>

    </header>