HackMD - Collaborative Markdown Knowledge Base

第一阶段 web前端基础入门学习 HTML+CSS > 初学者必备web前端教程入门到精通（HTML+CSS） 25 编程小白福音系列 > HTML+CSS新手快速入门教程（编程小白福音系列一） 35 编程小白福音系列 > HTML+CSS编程小白福音系列【第二季】 38 HTML+CSS > Web前端小白轻松入门（HTML+CSS） 41 定位、锚点 > 定位-锚点 431 CSS盒模型 > css盒模型 437 CSS层叠样式 > CSS层叠样式 439 Grid布局 > Grid布局 450 BFC > BFC 459 网格布局 > 网格布局 460 HTML5新增元素 > HTML5+css新增元素 464 CSS3选择器 > CSS3选择器 466 渐变、动画、变形 > 渐变、动画、变形 469 CSS核心属性 > css核心属性 470 元素类型 > 元素类型 471 WebApp 布局 > WebApp 布局 472 表单进阶 > 表单进阶 473 <a href="http://video.mobiletrain.org/video/3/25/">初学者必备web前端教程入门到精通（HTML+CSS）</a> <a href="http://video.mobiletrain.org/video/3/41/">Web前端小白轻松入门（HTML+CSS）</a> <table> <tr> <td bgcolor=blue rowspan="4"> 第一阶段web前端基础入门学习 </td> <td><a href="http://video.mobiletrain.org/video/3/25/">HTML+CSShtml5视频教程</a> </td> <td colspan="2"><a href="http://video.mobiletrain.org/video/3/35/">编程小白福音系列html5视频教程</a> </td> <td><a href="http://video.mobiletrain.org/video/3/439/">CSS层叠样式html5视频教程</a> </td> <td><a href="http://video.mobiletrain.org/video/3/437/">CSS盒模型html5视频教程</a> </td> </tr> <td><a href="http://video.mobiletrain.org/video/3/431/">定位、锚点html5视频教程</a> </td> <td><a href="http://video.mobiletrain.org/video/3/459/">BFChtml5视频教程</a> </td> <td><a href="http://video.mobiletrain.org/video/3/450/">Grid布局html5视频教程</a> </td> <td><a href="http://video.mobiletrain.org/video/3/460/">网格布局html5视频教程</a> </td> <td><a href="http://video.mobiletrain.org/video/3/464/">元素类型html5视频教程</a> </td> </tr> <tr> <td><a href="http://video.mobiletrain.org/video/3/464/">HTML5新增元素</a> <td><a href="http://video.mobiletrain.org/video/3/466/">CSS3选择器html5视频教程</a> </td> <td colspan="2"><a href="http://video.mobiletrain.org/video/3/469/">渐变、动画、变形html5视频教程</a> </td> <td><a href="http://video.mobiletrain.org/video/3/470/">CSS核心属性html5视频教程</a> </td> <tr> <td><a href="http://video.mobiletrain.org/video/3/472/">WebApp 布局html5视频教程</a> </td> <td><a href="http://video.mobiletrain.org/video/3/473/">表单进阶</a> </td> </tr> </tr> </table> 第二阶段深入了解web前端 jQuery > jQuery入门到精通全套教程 50 Gulp > 项目构建工具Gulp入门全套教程 51 模块化开发案例 > 模块化开发案例贪吃蛇小游戏 53 Express4实战教程 > Express4实战教程-服务搭建及接口编写 54 Bootstrap > Bootstrap入门教程 56 逻辑思维训练 > 逻辑思维训练 59 JavaScript > JavaScript精选全套合集入门到精通完整版 63 JavaScript > JavaScript面向对象编程（实战+案例） 64 JavaScript > JavaScript正则表达式的使用+歌词滚动案例 65 JavaScript > JavaScript DOM的概念及基本操作 66 面向对象 > 面向对象 474 js内置对象 > js内置对象 476 Es6 > Es6 477 原型原型链 > 原型原型链 478 <a href="http://video.mobiletrain.org/video/3/64/"> JavaScript面向对象编程（实战+案例）</a> <a href="http://video.mobiletrain.org/video/3/65/">JavaScript正则表达式的使用+歌词滚动案例</a> <a href="http://video.mobiletrain.org/video/3/66/">JavaScript DOM的概念及基本操作</a> <table> <tr> <td bgcolor=blue rowspan="4"> 第二阶段深入了解web前端 </td> <td><a href="http://video.mobiletrain.org/video/3/63">JavaScript</a> </td> <td><a href="http://video.mobiletrain.org/video/3/50/">jQuery</a> </td> <td><a href="http://video.mobiletrain.org/video/3/51/">Gulp</a> </td> <td><a href="http://video.mobiletrain.org/video/3/53/">模块化开发案例</a> </td> </tr> <tr> <td colspan="2"><a href="http://video.mobiletrain.org/video/3/54/">Express4实战教程</a> </td> <td><a href="http://video.mobiletrain.org/video/3/56/"> Bootstrap</a> </td> <td><a href="http://video.mobiletrain.org/video/3/59/">逻辑思维训练</a> </td> <td><a href="http://video.mobiletrain.org/video/3/474/">面向对象</a> </td> </tr> <tr> <td><a href="http://video.mobiletrain.org/video/3/476/">js内置对象</a> </td> <td><a href="http://video.mobiletrain.org/video/3/477/">Es6</a> <td><a href="http://video.mobiletrain.org/video/3/478/">原型原型链</a> </td> </tr> </tr> </table> 第三阶段web前端高级课程精讲 <a href="http://video.mobiletrain.org/video/3/242/">设计模式 > 常用的4种设计模式</a> <a href="http://video.mobiletrain.org/video/3/232/">微信小程序开发 > 微信小程序零基础教程-微信小程序开发学习</a> <a href="http://video.mobiletrain.org/video/3/239/">微信小程序开发 > 微信公众号开发教程全开源（强烈推荐）</a> VUE > VUE.JS全套教程从入门到精通（强烈推荐） 164 Node.js > 前端Node.js入门到实战全集 177 react > react入门教程+实战项目（react全家桶） 178 ongoDB数据库 > MongoDB数据库全套（精华版）185 react > React入门到大神 187 uniApp > uniApp视频全套资料配源码 209 Nuxt框架+SSR > 深入浅出的讲解Nuxt框架的使用+SSR（服务器端渲染 215 Flutter > 最新Flutter全套视频~全套资料 216 GraphQL > GraphQL入门到精通 217 微信小程序开发 > 微信小程序设计基础与实战 222 微信小程序开发 > 微信小程序零基础教程-微信小程序开发学习 232 微信小程序开发 > 微信公众号开发教程全开源（强烈推荐） 239 设计模式 > 常用的4种设计模式 242 Webpack > 最新Webpack4.0教程 245 移动端网站开发 > 移动端网站布局开发，打造属于自己的“手机APP” 251 angular > angular 481 MongoDB > MongoDB 485 Express > Express 489 <table> <tr> <td bgcolor=blue rowspan="4"> 第三阶段web前端高级课程精讲 </td> <td><a href="http://video.mobiletrain.org/video/3/164/">VUE</a> </td> <td colspan="2"><a href="http://video.mobiletrain.org/video/3/177/">Node.js</a> </td> <td><a href="http://video.mobiletrain.org/video/3/178/">react</a> </td> <td><a href="http://video.mobiletrain.org/video/3/185/"> MongoDB数据库全套（精华版）</a> </td> </tr> <td><a href="http://video.mobiletrain.org/video/3/209/">uniApp</a> </td> <td><a href="http://video.mobiletrain.org/video/3/215/">Nuxt框架的使用+SSR</a> </td> <td><a href="http://video.mobiletrain.org/video/3/216/">Flutter</a> </td> <td><a href="http://video.mobiletrain.org/video/3/217/">graphQL</a> </td> <td><a href="http://video.mobiletrain.org/video/3/481/">angular</a> </td> <td><a href="http://video.mobiletrain.org/video/3/222/">微信小程序開發</a> </tr> <tr> <td><a href="http://video.mobiletrain.org/video/3/245/">Webpack</a> </td> <td colspan="2"><a href="http://video.mobiletrain.org/video/3/242/">設計模式</a> </td> <td><a href="http://video.mobiletrain.org/video/3/251/">移動端網站開發</a> </td> <tr> <td><a href="http://video.mobiletrain.org/video/3/485/">MongoDB</a> </td> <td><a href="http://video.mobiletrain.org/video/3/489/">Express</a> </td> </tr> </tr> VUE > VUE.JS全套教程从入门到精通（强烈推荐） 164 </table> 第四阶段web前端项目案例大全 <table> <tr> <td backcolor=blue rowspan="5"> 第四阶段web前端项目案例大全 </td> <td bgcolor=blue ><a href="http://video.mobiletrain.org/video/3/284/">React項目</a> </td> <td><a href="http://video.mobiletrain.org/video/3/286/">uni -app項目</a> </td> <td><a href="http://video.mobiletrain.org/video/3/293/"> 毕设项目</a> </td> <td><a href="http://video.mobiletrain.org/video/3/286/">实战项目</a> </td> <td><a href="http://video.mobiletrain.org/video/3/513/">NodeJSB实战项目</a> </td> </tr> <tr> <td><a href="http://video.mobiletrain.org/video/3/493/">小程序项目</a> </td> <td><a href="http://video.mobiletrain.org/video/3/513/">NodeJSB实战项目</a> </td> <td colspans="2"><a href="http://video.mobiletrain.org/video/3/288/">前端React项目教程（企业级实战开发）</a> <td></td> </tr> <tr> <td colspan="2"><a href="http://video.mobiletrain.org/video/3/289/">ReactNative项目之美食App</a> </td> <td colspan="2"><a href="http://video.mobiletrain.org/video/3/496/"> Koa+MongoDB打造简书后台管理系统</a> </td> <td><a href="http://video.mobiletrain.org/video/3/495/">小米电商项目</a> </td> </tr> <tr> <td colspan="2"><a href="http://video.mobiletrain.org/video/3/285/">React项目-React管理后台视频</a> </td> <td><a href="http://video.mobiletrain.org/video/3/498/">仿拉钩项目</a> </td> <td colspan="2"><a href="http://video.mobiletrain.org/video/3/509/">实战项目之幸福西饼</a> </td> </tr> <a href="http://video.mobiletrain.org/video/3/284/">React项目 > React项目全球新闻发布管理系统</a> <a href="http://video.mobiletrain.org/video/3/285/">React项目 > React项目-React管理后台视频</a> <a href="http://video.mobiletrain.org/video/3/288/">React项目 > 前端React项目教程（企业级实战开发）</a> <a href="http://video.mobiletrain.org/video/3/289/">React项目 > ReactNative项目之美食App</a> <a href="http://video.mobiletrain.org/video/3/290/">React项目 > 毕设论文辅导-React美食网</a> <a href="http://video.mobiletrain.org/video/3/494/">ReactNative项目之美食App > ReactNative项目之美食App</a> <a href="http://video.mobiletrain.org/video/3/511/">React项目教程（企业级实战开发） > React项目教程（企业级实战开发）</a> React项目 > React项目全球新闻发布管理系统 284 React项目 > React项目-React管理后台视频 285 React项目 > 前端React项目教程（企业级实战开发） 288 React项目 > ReactNative项目之美食App 289 React项目 > 毕设论文辅导-React美食网 290 ReactNative项目之美食App > ReactNative项目之美食App 494 React项目教程（企业级实战开发） > React项目教程（企业级实战开发） 511 <a href="http://video.mobiletrain.org/video/3/286/">uni-app项目 > uni-app入门到实战项目之《仿网易云音乐》</a> <a href="http://video.mobiletrain.org/video/3/287/">uni-app项目 > uni-app项目实战教程（前沿技术）</a> uni-app项目 > uni-app入门到实战项目之《仿网易云音乐》 286 uni-app项目 > uni-app项目实战教程（前沿技术） 287 <a href="http://video.mobiletrain.org/video/3/292/">NodeJS项目 > NodeJS+Express+MongoDB实战项目</a> <a href="http://video.mobiletrain.org/video/3/513/">NodeJS实战项目 > NodeJSB实战项目</a> NodeJS项目 > NodeJS+Express+MongoDB实战项目 292 NodeJS实战项目 > NodeJSB实战项目 513 <a href="http://video.mobiletrain.org/video/3/293/">毕设项目 > 最新最全前端毕设项目_强烈建议收藏</a> 毕设项目 > 最新最全前端毕设项目_强烈建议收藏 293 <a href="http://video.mobiletrain.org/video/3/298/">实战项目 > 纯原生前端技术打造仿小米电商网站视频</a> <a href="http://video.mobiletrain.org/video/3/300/">实战项目 > 实战项目之拉勾网</a> <a href="http://video.mobiletrain.org/video/3/301/">实战项目 > 实战项目之头条</a> <a href="http://video.mobiletrain.org/video/3/302/">实战项目 > 实战项目之幸福西饼</a> <a href="http://video.mobiletrain.org/video/3/304/">实战项目 > 实战项目之网易云</a> <a href="http://video.mobiletrain.org/video/3/306/">实战项目 > 1+X技能认证培训</a> < 实战项目 > 纯原生前端技术打造仿小米电商网站视频 298 实战项目 > 实战项目之拉勾网 300 实战项目 > 实战项目之头条 301 实战项目 > 实战项目之幸福西饼 302 实战项目 > 实战项目之网易云 304 实战项目 > 1+X技能认证培训 306 </table>

Syntax	Example	Reference
# Header	Header	基本排版
- Unordered List	Unordered List
1. Ordered List	Ordered List
- [ ] Todo List	Todo List
> Blockquote	Blockquote
Bold font	Bold font
Italics font	Italics font
~~Strikethrough~~	~~Strikethrough~~
19^th^	19^th
H~2~O	H₂O
++Inserted text++	Inserted text
==Marked text==	Marked text
[link text](https:// "title")	Link
![image alt](https:// "title")	Image
`Code`	`Code`	在筆記中貼入程式碼
```javascript var i = 0; ```	`var i = 0;`
:smile:		Emoji list
{%youtube youtube_id %}	Externals
$L^aT_eX$	L^aT_eX
:::info This is a alert area. :::	This is a alert area.