- HTML5模板
- HTML5标签
- 详解HTML 头标签元素的意义以及使用场景
- 标签语义化
- nav, section, article, aside, menu, menuitem, figure
- p, br, hr, blockquote, code, pre
- title, mark, small, del, i, em, sub
- header, footer, summary, details, time, dialog
- ul li, dl dt dd, h1 to h6
- fieldset, legend, form , label, input, select
- table, caption, thead, tbody, th, thd, tfoot
- SEO
-
CSS Tricks
- CSS实例
- CSS选择器优先级
- 定位(Position)
- 盒模型(BoxSize)
- 清除浮动(Clearfix)
- 水平居中
- 垂直居中
- 左右结构，流式布局
- 上下结构
- a链接伪类 (a:link、a:visited、a:hover、a:active)
- font-family
- input美化
- file upload按钮美化
- CSS选择器(CSS Selector)
- 模拟下拉菜单
- 字符超出隐藏
- 背景图片尺寸(background-size)
- before & after 伪元素
- Media Query - 媒体查询
- Web Font(在线字体)
- 字体图标
- 在线字体
- CSS3动效
- CSS3 Filter - 滤镜特效
- CSS3渐变
- FlexBox[图]
- Sass
- CSS实例
-
UI框架
-
设计 +
![FlexBox[图]](/GengHH/FED-Learn-Path/blob/master/assets/imgs/flexboxsheet.png){kind=link}
- 库
- jQuery (DOM操作、ajax、事件委托、自定义事件、js动画...)
- Zeptojs (小型jQuery 9.1kb，移动端jQuery类库，语法相同)
- Underscore/lodash (数据操作库)
- 模板引擎 (为什么要用模板引擎?)
- 前端模板
- 后端模板(Java)
- JSP
- FreeMarker
- 框架
- 实例
- 选项卡
- 轮播图
- 代码片段
- js优化 & 编码技巧
- 模块化
- 为什么要模块化
- CommonJS规范
- AMD规范
- CMD规范
- Sea.js
- HTML5/CSS3
- 移动端性能优化指南[图]
- Safari按钮Reset
- 媒体查询 + REM单位
![移动端性能优化指南[图]](/GengHH/FED-Learn-Path/blob/master/assets/imgs/mobile.png){kind=link}
![gulp手册[图]](/GengHH/FED-Learn-Path/blob/master/assets/imgs/gulp.png){kind=link}
![Git常用命令速查表[图]](/GengHH/FED-Learn-Path/blob/master/assets/imgs/git.jpg){kind=link}
- 编辑器
- Sublime Text3
- Atom
- VS Code
- IDE
- WebStorm
- HBuilder
- Cloud9 IDE
- Visual Studio
- 调试工具
![Sublime Text快捷键[图]](/GengHH/FED-Learn-Path/blob/master/assets/imgs/sublime-text-3-cheat-sheet-wallpaper-large.jpg){kind=link}