下面是一个简单的示例代码，大家将使用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的浏览器越来越多，所以使用它来布局你的页面是一个明智的选择。