CSS3中的Flexbox是一個很強大的工具，它可以幫助我們更加靈活地布局我們的網頁元素。然而，很多菜鳥在剛開始學習Flexbox時會感到困惑，本文將為大家介紹一些基礎的Flexbox用法。

首先，我們需要給包裹我們網頁元素的父容器設置display:flex;，這樣我們的元素就可以開始使用Flexbox的屬性和值了。

.container {
display: flex;
}

下面我們來看一些常用的Flexbox屬性：

1. justify-content: 控制元素在主軸上的對齊方式。

.container {
display: flex;
justify-content: center; /* 居中對齊 */
}

2. align-items: 控制元素在交叉軸上的對齊方式。

.container {
display: flex;
align-items: center; /* 居中對齊 */
}

3. flex-direction: 控制主軸的方向，可以是row（默認值）、row-reverse、column、column-reverse。

.container {
display: flex;
flex-direction: column; /* 列排列 */
}

4. flex-wrap: 控制被包裹元素的換行方式。

.container {
display: flex;
flex-wrap: wrap; /* 換行 */
}

5. flex-grow: 元素的增長比例。

.box {
flex-grow: 1;
}

6. flex-shrink: 元素的收縮比例。

.box {
flex-shrink: 2;
}

7. flex-basis: 元素在主軸上占據的空間。

.box {
flex-basis: 100px;
}

以上是Flexbox的一些基礎用法，希望對各位菜鳥有所幫助。