两张img图片放在一起,之间会有间距,而我们需要的是两张图片中间间距为0,以便使用我们计算好的间距。
首先我们需要知道,img标签是一个inline属性的内联元素,内联元素具有文字的特性,会受到文字大小的影响,这里分为img标签上下排列和左右排列的情况。
img标签左右排列处理空白间距方法:
1、设置父元素的font-size为0;
2、设置float
3、使用负值margin消除间距
img标签上下排列处理空白间距的方法:
img标签具有文字的属性,首先需要去除行高line-height的影响
1、line-height:0;
文本在网页中显示是基于基线对齐的,如果先要让上下两者中间没有间距,也要消除对齐方式的影响,将垂直对齐方式设置为中线对齐。
2、virtical-align:middle
如果深入学习,可以了解一下行高、行距、顶线、中线、基线、底线。
版权声明:本文为qq_38877858原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。