CSS3伸縮布局（flexbox）是一個用于網頁布局的強大工具，可以讓我們更輕松地創建適應不同屏幕尺寸的現代網頁，同時也可以簡化許多在傳統布局中出現的問題。

下面是一個簡單的示例代碼，我們將使用flexbox對頁面上的三個元素進行布局：

.container {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.box {
background-color: #f2f2f2;
padding: 20px;
margin: 10px;
border: 1px solid #ddd;
flex: 1;
}

在這個示例中，我們首先定義了一個容器類.container，并將其display屬性設置為flex，這表示我們要使用flexbox進行布局。接下來，我們使用justify-content屬性將布局中的所有元素水平居中對齊，使用align-items屬性將它們垂直居中對齊。最后，我們還在.box類中使用了flex屬性，這表示我們愿意讓這個元素在剩余的空間中占據多大比例的空間。

這個示例只是flexbox的冰山一角，它可以做很多有趣的事情，例如對其內容進行對齊、排序和分行。此外，因為支持flexbox的瀏覽器越來越多，所以使用它來布局你的頁面是一個明智的選擇。