CSS發(fā)射點(diǎn)（CSS Grid）是CSS3引進(jìn)的新特性，它允許我們以多種方式控制網(wǎng)格的布局和設(shè)計(jì)。使用CSS發(fā)射點(diǎn)，我們可以輕松地將元素放在網(wǎng)格上，并指定它們?nèi)绾卧谄渲信帕小?/p>

/* 定義網(wǎng)格 */
.container {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: 100px 200px;
}
/* 在網(wǎng)格中放置元素 */
.item-1 {
grid-column: 1 / 3;
grid-row: 1 / 2;
}
.item-2 {
grid-column: 2 / 4;
grid-row: 2 / 3;
}

在這個(gè)例子中，我們定義了一個(gè)名稱為.container的CSS類，它設(shè)置了一個(gè)網(wǎng)格。該網(wǎng)格有三個(gè)列和兩個(gè)行，其中每個(gè)列的寬度都為1fr，而第一行的高度為100px，第二行的高度為200px。

接下來，我們定義了兩個(gè)CSS類item-1和item-2，并為它們設(shè)置了網(wǎng)格列和網(wǎng)格行的位置。因?yàn)榫W(wǎng)格是從左上角開始的，所以我們使用grid-column和grid-row屬性來指定元素在網(wǎng)格中的位置。

使用CSS發(fā)射點(diǎn)，我們可以輕松地創(chuàng)建復(fù)雜的網(wǎng)格布局，使網(wǎng)頁具有更好的可讀性和可訪問性。我們還可以使用響應(yīng)式設(shè)計(jì)來使網(wǎng)站在不同的設(shè)備上呈現(xiàn)不同的布局。