问题的情况如下:
image.png
即背景div与子img没有完全对齐，有一个不可预知的像素差值。图片中蓝条即是背景div漏出来的颜色。
我的结构如下:
<div className="bgblock">
<img className="innerimg" src={item.coverImgUrl} />
</div>
css样式如下:
.bgblock
{
width:100%;
position: relative;
background-color: blue;
// 背景图片
.innerimg
{
// vertical-align: bottom;
width:100%;
height:auto;
-webkit-border-radius: 4px;
}
}
即bgblock用图片的高度撑开，然而就是出现了如上图片的奇葩问题...
一番分析代码，以及实际解析的样式并木有发现问题。又是一番搜索...
最终解决方案如下：
在子img里面设置 vertical-align: bottom;顺利解决问题，不知为何，奇葩。
网友评论