简介
在这个项目中,你将学习如何使用 CSS Flexbox 创建一个水果摆放布局。你将学习如何使用 align-self
和 order
属性来在碗中定位和排列水果。
👀 预览

🎯 任务
在这个项目中,你将学习:
- 如何为水果摆放设置 HTML 结构
- 如何使用
align-self
属性沿交叉轴对齐各个弹性项目 - 如何使用
order
属性更改弹性项目的顺序 - 如何使用 Flexbox 将水果排列成所需的布局
🏆 成果
完成这个项目后,你将能够:
- 使用 CSS Flexbox 创建一个响应式且视觉上吸引人的布局
- 应用
align-self
和order
属性来控制元素的定位和排列 - 使用 CSS 选择器和属性实现所需的设计