选择 CSS 属性前，先辨认主轴和交叉轴
先读关卡目标，观察青蛙和荷叶的位置。默认行方向下，justify-content 沿水平主轴分布项目，align-items 沿垂直交叉轴对齐项目。输入值之前，先说清自己要改变哪条轴，避免给控制另一方向的属性选了一个看似正确的值。
flex-direction 改为列方向后，主轴和交叉轴也随之改变，不能继续把 justify-content 理解为只控制水平位置。在编辑器里一次改一条 CSS，再比较青蛙与目标荷叶的位置。青蛙由 CSS 定位，不是拖动到位；练习应围绕当前关卡提示和允许使用的属性。
解释上次为什么没对齐，再改一项
没有达到目标时，先检查属性是否控制了错误的轴、属性值是否与预期不同，或当前方向是否改变了布局含义。保留已经理解的规则，只改一项。一次替换多个属性可能碰巧成功，却难以知道究竟是哪项修正起作用。
成功后，用一句话描述规则：使用哪条轴、怎样把青蛙相对荷叶定位。后续关卡会组合概念，这种解释比死记一行答案更有用。本中心帮助理解实际遇到的关卡，不编造完整答案表，也不把完成小游戏当作专业 CSS 能力认证。
例如，本来想横向移动，规则却让青蛙上下变化，就先检查 flex-direction，重新辨认主轴，再选属性值。说清属性控制什么、当前轴沿什么方向，再修改一项并观察。成功后，用画面里的荷叶验证解释，让一次错误猜测变成可重复使用的布局知识。
Flexbox Froggy 技巧和策略
勾选下一局想练习的技巧。这份清单不会改变游戏或保存游戏进度。
Flexbox Froggy 问题和答案
我需要安装编程工具吗？
不，CSS 编辑器在浏览器游戏内部。
这是一个完整的网站开发课程吗？
这是一个用于练习 Flexbox 布局概念的交互式游戏。它不能替代更全面的 HTML 和 CSS 课程。
这个项目是谁创建的？
Thomas Park 创建了 Flexbox Froggy。源代码采用 MIT 许可，录制的封面使用了 CC BY 3.0；署名链接如下。
反转方向后，flex-end 为什么把青蛙移向另一边？
Flexbox 的起点和终点取决于当前主轴，并非固定的左边和右边。使用 row-reverse 时，主轴从右侧开始，因此 justify-content: flex-end 会把元素移向左侧。先检查 flex-direction，再选择对齐值；align-items 调整的是交叉轴，解决的是另一种位置问题。