CSS3里面的flexible box，簡稱flexbox，是一種新的布局模式，可以幫助開發(fā)者更靈活地布局和定位元素。Flexbox基于一個容器和其中的項（item）來工作。容器（container）是我們想要進(jìn)行布局的父元素，項（item）則是容器里的子元素。通過設(shè)置容器的flex屬性以及項的flex規(guī)則，我們可以實現(xiàn)很多靈活的布局方式。

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

上面的代碼演示了如何創(chuàng)建一個簡單的Flexbox布局。其中，容器被設(shè)置為display: flex，表示該容器采用Flexbox布局。項被設(shè)置為flex: 1，表示該項的flex值為1，在父容器中需要占據(jù)相同的空間。

Flexbox的一大特點是方便的對齊方式控制。通過設(shè)置容器的justify-content屬性和align-items屬性，我們可以實現(xiàn)水平居中、垂直居中和居中對齊等各種對齊方式，而無需使用繁瑣的布局技巧。

.container {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.item {
flex: 1;
margin: 10px;
background: #ccc;
height: 50px;
}

上面的代碼演示了一個水平居中的布局。容器的justify-content屬性被設(shè)置為center，表示容器內(nèi)的項在水平方向上居中對齊。同時，項的寬度被設(shè)置為flex: 1，表示該項需要與其他項占據(jù)相同的寬度，同時在各自之間留有10px的空隙。

綜上，F(xiàn)lexbox是CSS3中強(qiáng)大而靈活的布局模式，它為開發(fā)者提供了更多的布局和對齊方式，極大地簡化了前端開發(fā)的難度。