gpt4 book ai didi

html - CSS:一条 2 像素的线出现在图像 (IMG) 元素下方?

转载 作者:太空狗 更新时间:2023-10-29 16:49:45 25 4
gpt4 key购买 nike

谁能告诉我为什么在图像下方和导航栏上方有一条线(背景色,在本例中为红色)? Firefox 和 Chrome 都显示红线,所以我认为它是按预期呈现的。但我似乎无法通过开发者工具找到问题所在。 borders, paddings 和 margins 都是0,很费解。这是代码的精简版本,或 jsfiddle.net/bvss4/9 :

  <body>
<div id="main-wrapper">
<header id="main-header">
<img id="title-image" src="http://i.imgur.com/JaYSY.jpg" />
<div id="main-navbar">
STUFF
</div>
</header>
</div>
</body>

CSS:

* {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}

#main-wrapper {
width: 90%;
margin: 0 auto;
border: 3px solid #888;
margin-top: 20px;
background: red;
}

#title-image {
width: 100%;
}

#main-navbar {
width: 100%;
background: #333333;
}

bad red line

最佳答案

display:block 添加到您的 #title-image 将修复它

 #title-image {
width: 100%;
display:block;
}

JSFiddle here

关于html - CSS:一条 2 像素的线出现在图像 (IMG) 元素下方?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8828215/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com