如果你总是被元素溢出、奇怪缩放、居中写半天还不对这些 CSS 布局问题困扰,这期视频会带你系统理解 Flex 布局。内容会从 display: flex; 的基础概念讲到主轴和交叉轴、对齐、换行,以及 flex-grow 和 flex-shrink 在响应式中的实际作用。
🔥 本期核心看点
✅ 搞懂 flex container、flex item、主轴和交叉轴到底是什么
✅ 学会 justify-content 和 align-items,轻松实现常见居中布局
✅ 理解 flex-direction 为什么会直接影响对齐结果
✅ 掌握 gap、flex-wrap、align-content 在多行布局里的区别
✅ 学会用 flex-grow、flex-shrink、min-width、max-width 处理缩放和溢出问题
✅ 了解 align-self 和 margin-right: auto; 这些非常实用的小技巧
👉 加入 Discord 交流群,请移步主页置顶动态,或私信发送暗号【交流群】
☕️ 关于我
这里是林想的Web工坊,我会分享实用、有趣的前端与 CSS 技巧。希望帮你少走弯路,多些写代码的乐趣!如果觉得视频对你有帮助,欢迎一键三连支持一下~