」工欲善其事,必先利其器。「—孔子《論語.錄靈公》
首頁 > 程式設計 > 如何創建CSS中高度不同的砌體網格佈局?

如何創建CSS中高度不同的砌體網格佈局?

發佈於2025-03-24
瀏覽:563

How to Create a Masonry Grid Layout with Varying Heights in CSS? 
CSS MASONRY GRID帶有flexbox或其他佈局

在CSS中創建一個網格佈局,其中元素具有變化的高度可能具有挑戰性。儘管Flexbox提供了靈活性,但它可能無法滿足以下要求,即較新元素與上一個的底部對齊。 介紹CSS Grid Layout

html結構:

CSS:

{ 網格行:跨度1; 背景色:綠色; } [高的] { 網格行:跨度2; 背景色:深紅色; } [更高] { 網格行:跨度3; 背景色:藍色; } [最高] { 網格行:跨度4; 背景色:灰色; } 說明:將容器作為網格佈局初始化。 pixels。

grid-gap:10px:

指定網格項目之間的間距。

指示該項目應佔據x網格行。 [&& &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&
最新教學 更多>

免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。

Copyright© 2022 湘ICP备2022001581号-3