CSS的彈性布局讓我們可以更快速、更方便地進行響應式布局的設計。在使用CSS彈性布局時，需要定義容器的屬性，如以下所示：

.container {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}

以上代碼中，我們定義了一個名為.container的容器，指定了它的display屬性為flex，讓容器成為一個彈性容器。然后，使用flex-direction屬性指定了主軸的方向為row，即水平方向，justify-content屬性指定了子元素在主軸上的對齊方式為center，表示子元素在容器中水平居中對齊，align-items屬性指定了子元素在交叉軸上的對齊方式為center，表示子元素在容器中垂直居中對齊。這些屬性的設置會影響彈性容器中子元素的排列方式。

下面我們來看一下在子元素上設置flex屬性是如何實現彈性布局的：

.item {
flex: 1;
}

以上代碼中，我們定義了.item元素，并在其上設置了flex屬性，這個屬性是用來分配容器中可用空間的。在這個例子中，容器的寬度會根據屏幕大小變化而改變，item元素的寬度也會根據容器可用空間調整，而此時它們的寬度是相等的。如果我們在一個item元素上設置flex屬性為2，那么該元素在容器中所占比例會比其他元素多一倍。

以上就是CSS彈性布局的基礎代碼，我們可以通過不同的屬性設置來實現不同的布局效果。在實際開發中，我們還會使用媒體查詢等技術來適配不同設備的屏幕尺寸，從而實現更好的響應式布局效果。