<分区>
<分区>
我知道你们更喜欢 stackcode,但这是很多,而且在我尝试时没有正确显示,但是,我将提供基本的上下文。
这里是 HTML 和 CSS 的总结:
#logoDiv{
}
#jqueryLogo{
height: 60px;
padding: 0;
margin: 0;
}
/*vvv HEADER BELOW vvv*/
#header{
height: 50px;
background-color: #05568D;
border-radius: 10px 10px 0px 0px;
}
#header > ul{
list-style-type: none;
padding: 0px 20px 0px 20px;
margin: 0px;
}
#header > ul > li{
padding: 0px 10px 0px 10px;
color: white;
font-size: 20px;
line-height: 54px;
float: left;
}
<div id="logoDiv">
<img id="jqueryLogo" src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/81/JQuery_logo_text.svg/2000px-JQuery_logo_text.svg.png" alt="" >
</div>
<div id="header" class="container">
<ul>
<li>Download</li>
<li>API Documentation</li>
<li>Blog</li>
<li>Plugins</li>
<li>Browser Support</li>
</ul>
</div>
问题: Logo 图片和页眉之间有 7.5 像素的边距。我没有设置任何边距来引起这种情况,当我检查元素时,那里什么也没有显示...但是当我用 div 封装 Logo img 时,它现在显示的空间等于那个 div。
如何去掉页眉和 Logo 图片之间的空白?
最佳答案
按照@Sol 对您的问题的评论,仅向您的图像元素添加一个显示 block
#jqueryLogo {
height: 60px;
display: block;
}
Display: block 移除父元素四周的所有空格,并根据子元素的实际高度和宽度进行调整。
关于html - 为什么我的 60px <img> 有一个 7.5px 的底部边距,而我从未设置它并且在 'Elements' 控制台中没有任何注册?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50521586/