css实现朋友圈照片排列布局的代码

<ul>
    <li v-for="(item, index) in imgList" :key=index >
        <img :src="item">
    </li>
</ul>

ul{
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
li{
  width: 32%; 
  height: 100px;
  margin-top: 5px;
}
.list:not(:nth-child(3n)) {
  margin-right: 2%;
}

ul li: nth-last-child(1): first-child{
  width: 200px;
  height: 200px;
}

ul li: nth-last-child(4): first-child ~ li: nth-child(2n){
  margin-right: 32%;
}

ul li: nth-last-child(4): first-child , ul li: nth-last-child(4): first-child ~ li{
  width: 50%;
  margin-right: 0;
}