Several methods to solve the spacing between pictures

When we use the img tag will encounter more problems img own pitch following

Are many ways to solve this problem, let's briefly talk about

1. If you want to solve with just vertical spacing resolve vertical-align This property can be a

img{
        
        vertical-align: top;
    }

The parent element coupled to a line-height attribute or tag img

div{
   
        line-height: 0;
    }

If the picture is very wide on a per line paintings, such as mobile end of long chart, add pictures to display: block; on it;

2. If you want to solve around the spacing can certainly ask around the pitch are canceled, then add margin or padding, but there are friends in the online issue annotate wrapped around an img tag, effective pro-test

 <img src="./temimage.jpg" alt=""><!--
        --><img src="./temimage.jpg" alt=""><!--
        --><img src="./temimage.jpg" alt=""><!--
        --><img src="./temimage.jpg" alt=""><!--
        --><img src="./temimage.jpg" alt=""><!--
       --><img src="./temimage.jpg" alt=""><!--
       --><img src="./temimage.jpg" alt=""><!--
       --><img src="./temimage.jpg" alt="">

Or write all tags side by side, such an approach Yen value is too low, and not easy to read is not recommended

<img src="./temimage.jpg" alt=""><img src="./temimage.jpg" alt=""><img src="./temimage.jpg" alt="">

3. Finally, of course, is clear all the pitches

　　To make images float property

img{
        float: left;
        
    }

　　You can add to the parent element font-size

{div 
    
        font -size: 0 ; 
       
    } // If the font-size value to the pitch of the picture, then the value becomes, so to add a definition of the text when the text is necessary to separate the font-size

　　Parent element with a flex,

div{
        display: flex;
        flex-wrap: wrap;
       
       
    }