img标签自带的间距问题

## 写界面时会发现img标签自带间距,设置margin:0;也是无济于事;

像下图这样:
img标签自带的间距问题_第1张图片
可以明显的看出文字和图片之间是存在白色的间距的,但是我并没有写margin或者是padding;正常的编写
img标签自带的间距问题_第2张图片

解决方案:

1,给img标签添加vertical-align:top/middle/bottom; 别设置baseline;因为图片默认就是基线 对齐,这也是造成问题的原因;

2,给父元素添加font-size:0; 但是这样有个隐患,子元素的字体大小需要从新定义;

3,给img标签添加display:block; 这样也有隐患,会改变img标签本身内联块元素的特性;

三种方法视情况选用:
img标签自带的间距问题_第3张图片
空白不见了

你可能感兴趣的:(web前端问题)