原文链接：传送门
1.给图片包裹元素加属性
position: relative; //用弹性盒子让图片垂直排列
display: flex;
flex-direction: column;
2.给图片本身加属性
1）vertical-align:top; 或者 vertical-align:bottom; //垂直对齐方式
2）margin-top: -10rpx; (先不建议这种方法哈，不够科学) //负margin值
代码示例(微信小程序)：
wxml代码
<view class='big_tu'>
<image src='http://www.doujiew.com/bdjwtest/img/cms/bg_summeractivity_01.png' style='width:100%;'></image>
<image src='http://www.doujiew.com/bdjwtest/img/cms/bg_summeractivity_02.png' style='width:100%;'></image>
<image src='http://www.doujiew.com/bdjwtest/img/cms/bg_summeractivity_03.png' style='width:100%;'></image>
<image src='http://www.doujiew.com/bdjwtest/img/cms/bg_summeractivity_04.png' style='width:100%;'></image>
</view>
wxss代码
.big_tu{
width: 100%;
margin-bottom: 120rpx;
/* position: relative;
display: flex;
flex-direction: column; */
}
.big_tu image{
background: lightblue;
/* margin-top: -10rpx; */
aligvertican:top;
}
