在 CSS 柵格系統(tǒng)中,邊距是一個(gè)不可或缺的概念。邊距可以用來(lái)控制柵格系統(tǒng)中網(wǎng)格之間的間距,以及網(wǎng)格和頁(yè)面邊緣之間的間距。邊距可以在柵格系統(tǒng)的容器、行和列中設(shè)置,以下是一些常用的邊距屬性:
.container { margin-left: auto; margin-right: auto; padding-left: 10px; padding-right: 10px; } .row { margin-top: 10px; margin-bottom: 10px; } .col { padding-top: 10px; padding-bottom: 10px; }
在上面的代碼中,.container
類設(shè)置了左右外邊距使其水平居中,并設(shè)置了左右內(nèi)邊距為 10 像素。.row
類設(shè)置了上下外邊距為 10 像素,而.col
類設(shè)置了上下內(nèi)邊距為 10 像素。
需要注意的是,在柵格系統(tǒng)中,邊距的值應(yīng)該是相對(duì)于與其關(guān)聯(lián)的元素的百分比,而不是固定的像素值。這是因?yàn)椴煌O(shè)備和屏幕大小可能需要不同的柵格寬度和邊距值。因此,使用百分比值可以使得柵格系統(tǒng)更具有響應(yīng)式特性。