请解释Flex布局的核心概念和常用属性，并以一个具体场景为例说明如何用Flex实现常见布局。

回答思路

1. 准确说明Flex容器与项目的概念
2. 列出flex-direction、justify-content、align-items等关键属性
3. 用具体场景（如水平居中、两栏布局）演示实现
4. 能解释flex-grow、flex-shrink、flex-basis的作用