CSS-消除图片默认间距方案

CSS-消除图片默认间距

通常我们会遇到这样的问题:
图片与图片以及文字之间会遇到中间存在默认间距:
CSS-消除图片默认间距方案_第1张图片
html:

解决方案:

有以下三种,建议只采用前两种

方案一:

将img显示设置成display:block;
因图片横向排列,同时设置向左浮动float:left;
代码如下:

css:

.Img{
  img{
    width: 100%;
    display: block;
    float: left;
  }
}

方案二:

在图片的父容器上设置字体大小为0;font-size:0;
代码如下:

css:

.Img{
  font-size: 0;
  img{
    width: 100%;
  }
}

方案三:

在图片后紧跟图片或文字,不换行;文字仅对span标签有用,
代码如下:

html

 
随便点

Ps:欢迎讨论交流,嘻嘻…

你可能感兴趣的:(CSS-消除图片默认间距方案)