CSS Grid 產生器

視覺化建立等分軌道的 CSS Grid 版型，支援預設與一鍵複製。

即時預覽

產生的 CSS

使用說明

調整左側的欄數、列數、間距與單位，或選擇預設；網格會立即更新。產生的 CSS 使用 repeat() 與 gap，可直接複製到樣式表。

常見問題

哪些瀏覽器支援 CSS Grid？

所有現代瀏覽器都支援 CSS Grid。如需相容非常舊的瀏覽器，可使用特性查詢加入降級方案。

可以使用不等寬的欄嗎？

可以。產生基礎版型後，將 grid-template-columns 改成 1fr 2fr 等比例即可。