Question

我正在尝试构建我的页面布局，到目前为止一直很好......直到我在我的标题上放置了一个图像。

当我尝试设置图像样式时，页面顶部会出现一条白线。我把代码放在JSFiddle上：http://jsfiddle.net/CCZjL/

当我删除：

#header img {
    width:66px; 
    height:61px;
    position:absolute;
    top:25px;
}

从我的CSS文件中，该行没有longuer ...... ???

任何人都可以向我解释这个吗？

谢谢你！

Answer 1

将margin: 0;和line-height: 65px;添加到#header h1

像这样：

#header h1 {
    text-align:center;
    font-size:20px;
    margin: 0;
    line-height: 65px;
}

您也可以从vertical-align: middle;删除#header。这不是必需的。

Answer 2

white-space来自h1。

浏览器默认将样式应用于元素。

最好删除所有默认样式。像：

*{
    margin:0;
    padding:0;
}

写：

#header h1 {
   margin:0;
}