column-count實現瀑布流布局


關鍵:

.waterfall {
  column-count: 4; //列數
  column-gap: 0;
}
.item{
  box-sizing: border-box;
//避免截斷
  break-inside:avoid;
}
  • 問題:數據會變為上下順序顯示。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM