div 里边只包含一个img, 结果div的高度比img图片的高度多3px_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:39:10
Original
1007 people have browsed it

在编写代码的时候,遇到这样一个问题, 下面为html和css

 

#header {
position: relative;
left: 0;
width: 100%;
top: 0;
}

#header img {
/*display: block;*/
width: 100%;
}

 

结果运行之后,发现header的高度总是比img的图片多出3px,不管是在移动端还是pc端,都会出现这种问题。

 

1, 刚开始以为是html的问题, 结果把html改成

还是不行,所以这可能就不是html的问题。

2,在网上查找资料,发现可以把img设置为block, 解决。

3,通过google了解到原因,img是一种类似text的元素,在结束的时候,会在末尾加上一个空白符,所以就会多出3px

 

   英文解释

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!