<ul class="list"> <li> <a class="link" href="#"> <img src="./images/1.jpg"> <div class="msk"></div> <div class="bottom"> <span class="icon-headset"></span><i>95萬</i><span class="icon-play"></span> </div> <p>百萬評論熱歌全集丨時實更新中</p> </a> </li> <li> <a class="link" href="#"> <img src="./images/2.jpg"> <div class="msk"></div> <div class="bottom"> <span class="icon-headset"></span><i>42萬</i><span class="icon-play"></span> </div> <p>網易雲音樂流行熱歌精選</p> </a> </li> <li> <a class="link" href="#"> <img src="./images/3.jpg"> <div class="msk"></div> <div class="bottom"> <span class="icon-headset"></span><i>73萬</i><span class="icon-play"></span> </div> <p>“其實我也很難過,你為什么不回頭看看我”</p> </a> </li> <li> <a class="link" href="#"> <img src="./images/4.jpg"> <div class="msk"></div> <div class="bottom"> <span class="icon-headset"></span><i>92876</i><span class="icon-play"></span> </div> <p>【袁婭維】我是一只魚&我要我們在一起 Acoustic</p> </a> </li> <li> <a class="link" href="#"> <img src="./images/5.jpg"> <div class="msk"></div> <div class="bottom"> <span class="icon-headset"></span><i>19萬</i><span class="icon-play"></span> </div> <p>在一起叫夢分開了叫痛沒做完的夢最痛</p> </a> </li> <li> <a class="link" href="#"> <img src="./images/6.jpg"> <div class="msk"></div> <div class="bottom"> <span class="icon-headset"></span><i>1694</i><span class="icon-play"></span> </div> <p>金毛托運中死亡,陳喬恩為其發聲</p> </a> </li> <li> <a class="link" href="#"> <img src="./images/7.jpg"> <div class="msk"></div> <div class="bottom"> <span class="icon-headset"></span><i>222萬</i><span class="icon-play"></span> </div> <p>我字字皆你,你卻句句非我</p> </a> </li> <li> <a class="link" href="#"> <img src="./images/8.jpg"> <div class="msk"></div> <div class="bottom"> <span class="icon-headset"></span><i>42萬</i><span class="icon-play"></span> </div> <p>E38. 雜談 | “困”在互聯網大廠的實習生們?</p> </a> </li> <li></li> <li></li> </ul>
.list {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
width: 689px;
margin: 20px auto 0;
}
.list li { width: 140px; max-height: 204px; padding-bottom: 30px; }
只需要在后面多加(每一列n個 n-2個)子元素,不設置高度或者后面加的子元素不設置高度,不然會出現空白