html - 删除标题(标题 img ？)和导航之间的间隙

Question

helpers :) 我在页眉和导航栏之间有一个间隙，这发生在除 index.html 之外的所有页面上。请在此处查看站点:danachapmanmassage.com。我检查过是否有任何边距、填充或边框影响它——没有找到。

HTML

        <header>
                <img src='images/5for5.png' 
                alt='Special Offer: 5 massages for just $50 each! Available through January, 2015.'>
        </header>


        <nav>
            <ul>
                <li><a href='index.html'>Home</a></li>
                <li><a href='services.html'>Services</a></li>
                <li><a href='about.html'>About</a></li>
                <li><a href='contact.html'>Contact</a></li>
            </ul>
        </nav>

CSS 主要样式

header {
    width: 100%;
    }


    /* ============================================= Nav Styles ============================================= */
nav {
    width: 100%;
    height: 2.5em;
    background: -webkit-linear-gradient(left, #AA893C, #806720, #E9D07C, #806720, #AA893C); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(left, #AA893C, #806720, #E9D07C, #806720, #AA893C); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(left, #AA893C, #806720, #E9D07C, #806720, #AA893C); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to left, #AA893C, #806720, #E9D07C, #806720, #AA893C); /* Standard syntax */
    } 

nav ul {
    width: 100%;
    text-align: center;
    }

nav li {
    width: 25%;
    padding-top: .75em;
    list-style-type: none;
    float: left;
    }

nav a {
    font-family: 'abeatbykairegular';
    font-size: 1em;
    text-decoration: none;
    color: #ffffff;
    }

nav a:hover {
    color: #42210B;
    }

CSS 页面特定样式(用于 services.html)

header img {
    width: 100%;
    }

menu {
    width: 100%;
    margin-top: 2%;
    }

menu ul {
    width: 40%;
    margin-left: 56%;
    }

menu li {
    width: 20%;
    list-style-type: none;
    text-align: center;
    float: right;
    }

menu a {
    font-family: 'abeatbykairegular';
    font-size: .85em;
    text-decoration: none;
    color: #ffffff;
    }

menu a:hover {
    color: #42210B;
    }

任何帮助将不胜感激!

Answer 1

修改您的 styles2.css 文件。

从第 23 行开始应该如下所示:

CSS:

header img {
    width: 100%;
    display: block;
}