How to clear the space between images and labels in css

1. Why is there a gap above and below the img tag? .

The fundamental reason is that the img tag is an inline element. The default vertical alignment of this element is the baseline of the parent element, but when displayed, it is aligned with the bottomline, which creates a gap between the upper and lower img tags.

1. The cleaning methods are:

方案一:div{font-size:0};
方案二:img{ display:block};
方案三:img{vertical-align:top;}
方案四:div{ margin-bottom:-3px };

2. Clearing method

(1)img{ display:block};

       将其改变为block元素,但是该方法太过粗暴,相当于从根本上改变了img。

(2)img{vertical-align:top;}

       改变其垂直对齐方式

(3)div{font-size:0};

      把父元素的文字大小设置为0

(4)div{ margin-bottom:-3px };

        这个方法不推荐

Readers are advised to use it according to their own circumstances.

Guess you like

Origin blog.csdn.net/tianxianghuiwei/article/details/134315627