解决HTML中div比其所包含的img高度高的问题

代码



  
    
    
    Document
    
  
  
    

效果:

解决HTML中div比其所包含的img高度高的问题_第1张图片


解决方案(任选一种):

1. div设置 font-size:0;

2. img设置 display:block;

3. div设置 display:flex;

4. img设置 vertical-align: middle;

原因:

The white space displayed below image elements in HTML is often cause for confusion, but there is a logical explanation: Images are inline elements, and inline elements have descenders.

链接

img是一种类似text的元素,在结束的时候,会在末尾加上一个空白符,所以就会变高

你可能感兴趣的:(HTML)