饥人谷 前端 VIP系统班教程（价值7K）【VIP】
前端工程化基础：CSS布局体系的实战拆解 前端开发中最容易被低估的能力，不是语法本身，而是对布局模型的掌控。这套课程以 CSS 布局与定位为核心，把「文档流」这个抽象概念拆成可复现、可调试的具体任务，帮助学习者从「会写样式」过渡到「能解布局题」。 课程覆盖三大层级。第一层是文档流与高度计算——很多开发者写样式时遇到塌陷、溢出问题，根源往往是对 block/…
前端工程化基础：CSS布局体系的实战拆解
前端开发中最容易被低估的能力，不是语法本身，而是对布局模型的掌控。这套课程以 CSS 布局与定位为核心，把「文档流」这个抽象概念拆成可复现、可调试的具体任务，帮助学习者从「会写样式」过渡到「能解布局题」。
课程覆盖三大层级。第一层是文档流与高度计算——很多开发者写样式时遇到塌陷、溢出问题，根源往往是对 block/inline/block-level 的层级关系没有建立直观认知。第二层是常用布局场景：按钮、技能条、作品展示区，每一个都是真实项目中的高频组件，结构清晰、代码可复用。第三层是太极图标与伪元素——这是进阶 CSS 的典型训练，学会用 :before/:after 构建图形，减少对图片资源的依赖，提升页面渲染性能。
课程配套有 HTTP 请求、Node.js 服务端的入门串讲，以及算法与数据结构的系统梳理。算法部分从伪代码、流程图入手，逐层推进到冒泡、选择、插入、快速、希尔五种经典排序，再延伸到计数排序、哈希表的应用，适合零基础或跨专业转向前端的学习者补全计算机基础。
建议先看任务11和任务12的全部视频，重点跟着做一遍按钮和技能条的 DOM 结构。学完后能够独立搭建响应式首页、处理复杂嵌套布局、用伪元素替代图标资源。配合任务13的 HTTP 知识回顾，可以建立前后端数据流转的完整认知。资料包用于对照练习，建议边看边动手，不要只看不练。
适合什么样的基础
- 已了解 HTML 基本标签，需要系统补齐 CSS 布局能力
- 有初步编程逻辑概念，想补齐算法与数据结构基础
- 从零开始自学，希望获得可落地的项目参考结构
课程目录
课程目录61 集
- 任务1 开班
- 任务11 入门：CSS布局与定位
- _fangfang-1023-2-文档流与高度.mp4 64.91M
- 任务12：CSS布局与定位续
- _fangfang-1027-2-鍒朵綔鎸夐挳.mp4 46.64M
- 任务12：CSS布局与定位续(1)
- _fangfang-1027-1-太极与伪元素.mp4 43.39M
- 任务13 入门：HTTP node.js HTML CSS 小结
- _fangfang-1029-3-澶嶄範璇锋眰.mp4 18.64M
- _fangfang-1029-4-再次复习请求.mp4 8.87M
- 任务13 入门：HTTP node.js HTML CSS 小结(1)
- 任务14 入门：算法与初级
- _fangfang-1031-4-浜旂鎺掑簭.mp4 93.42M
- _fangfang-1031-5-用伪代码实现排序.mp4 40.33M
- 任务15：数据结构
- _fangfang-1105-2-哈希&计数排序.mp4 45.43M
- _fangfang-1105-3-桶排序&基数排序.mp4 23.31M
- _fangfang-1105-4-闃熷垪鍜屾爤.mp4 15.14M
- _fangfang-1105-5-閾捐〃鍜屾爲.mp4 59.17M
- 任务16 进阶：JavaScript初体验
- _fangfang-1107-2-数据结构&一个div.mp4 46.88M
- _fangfang-1107-4-监听键盘事件.mp4 29.03M
- _fangfang-1107-6-使用localStorage.mp4 29.40M
- _fangfang-1107-7-瑙ｅ喅涓€涓猙ug.mp4 2.30M
- 任务17 进阶：第一个JS作品
- 任务18 进阶：Canvas画板
- _fangfang-1114-7-上节课作业解答.mp4 22.13M
- 任务19 进阶：Canva画板续
- _fangfang-1117-4-添加画笔颜色.mp4 47.76M
- _fangfang-1117-5-画笔粗细+保存图片.mp4 53.42M
- _fangfang-1117-6-灞€鍩熺綉璋冭瘯.mp4 11.39M
- 任务2 入门：计算机是如何存储数据的
- 任务20 JS里的数据
- _fangfang-1121-2-JS的黑历史.mp4 53.06M
- 任务3 入门：软件安装
- 任务4 入门命令行基础
- 任务41 考试：JS高级基础知识考试
- 任务42 高级：会动的简历
- _fangfang-0126-1-课程回顾.mp4 9.19M
- _fangfang-0126-2-页面会动的原理.mp4 21.82M
- _fangfang-0126-3-枯燥的写代码中.mp4 93.30M
- _fangfang-0126-4-初识异步与回调.mp4 107.19M
- 任务43 画一只皮卡丘
- _fangfang-0128-2-皮卡丘简单的部位.mp4 30.67M
- _fangfang-0128-3-皮卡丘复杂的部位.mp4 58.23M
- _fangfang-0128-4-展示皮卡丘的制作过程.mp4 46.43M
- _fangfang-0128-6-部署代码.mp4 8.44M
- 任务44 高级：Cookie与登陆注册
- _fangfang-0130-1-初级知识复习.mp4 11.84M
- 任务45 高级：Session、LocalStorage、Cache-Control
- _fangfang-0204-1-使用Session保存信息.mp4 55.05M
- _fangfang-0204-4-涓嶅熀浜嶤ookie鐨凷ession.mp4 10.37M
- _fangfang-0204-5-缓存控制Cache-Control.mp4 29.19M
- _fangfang-0204-6-如何更新缓存.mp4 20.26M
- 任务46 高级：初识webpack
- _fangfang-0206-1-使用命令行.mp4 78.56M
- _fangfang-0206-2-使用更多命令行.mp4 52.14M
- _fangfang-0206-3-用webpack来代替这些命令行.mp4 158.84M
- _fangfang-0206-4-用parcel代替该死的webpack.mp4 42.33M
- 任务47 高级：从MVC到ＭＶＶＭ
- _fangfang-0209-4-使用 Vue 做三个小东西.mp4 60.51M
- 任务48 高级：2018年前端面试押题
- 任务49 高级：简历
- _fangfang-0316-1-简历里面应该有什么.mp4 65.67M
- _fangfang-0316-3-个性化你的简历.mp4 146.11M
- 任务5 入门：脚本
- _fangfang-1008-2-脚本.mp4 6.08M
- _fangfang-1008-3-写脚本.mp4 9.92M
- _fangfang-1008-7-Node.js命令行.mp4 26.78M
- _fangfang-1008-8-Node.js脚本.mp4 25.49M
- 任务50 毕设：网易云音乐1
- _fangfang-0211-1-用例图、线框图、架构图.mp4 29.66M
- _fangfang-0211-3-七牛环境搭建.mp4 82.96M
- _fangfang-0211-4-七牛环境搭建2.mp4 78.48M
- 任务51 毕设：网易云音乐2
- _fangfang-0213-1-鑾峰彇澶栭摼.mp4 55.73M
- _fangfang-0213-4-模块化、MVC.mp4 41.94M
- 任务52 毕设：网易云音乐3
- _fangfang-0216-1-鑾峰彇姝屾洸.mp4 37.60M
- _fangfang-0216-2-淇敼姝屾洸.mp4 136.89M
- _fangfang-0216-3-视图状态丢失.mp4 18.17M
- 任务53 毕设：网易云音乐4
- _fangfang-0223-3-涓婁紶鍔犻攣.mp4 18.81M
- _fangfang-0223-5-播放页获取歌曲信息.mp4 49.91M
- 任务54 毕设：网易云音乐5
- 任务55 毕设：网易云音乐6
- _fangfang-0302-1-手机页面调试alert法.mp4 50.26M
- _fangfang-0302-2-手机页面调试vconsole法.mp4 31.08M
- 任务56 毕设：网易云音乐7
- 任务6 入门：http入门
- _fangfang-1010-2-WWW的历史.mp4 16.28M
- _fangfang-1010-6-璇锋眰绛旂枒.mp4 47.71M
- 任务7 入门：Node.js Server
- _fangfang-1013-2-网络与IP.mp4 51.29M
- 任务8 入门：HTML
- _fangfang-1015-2-璐拱鍩熷悕.mp4 12.14M
- 任务9 入门：HTML续
- _fangfang-1017-2-测试题讲解.mp4 45.67M
![[衡天云]爆款云服务器 低至12元/月](/hty.png)