课程分为基础知识应用及项目实战两大阶段。基础部分重点讲解HTML、CSS、JavaScript基础语法、WebAPI等前端开发基础阶段技能，构建前端知识体系；项
* 第一章 页面结构解析-HTML/
* 浏览器介绍/
* 认识网页
* 常见浏览器
* 浏览器内核
* web标准
* HTML基本结构/
* HTML初识
* HTML骨架
* 我的第一个页面及其标签简介
* 猪八戒版骨架记忆法
* HTML常用标签/
* 什么是标签及其分类
* 标签嵌套和并列关系
* 简单小测验
* 开发工具sublime
* sublime生成html骨架
* doctype文档类型
* 字符集简介
* 标签的语义化及其标题标签
* 段落标签和水平线标签
* 课堂案例-新闻页面
* 换行和div span标签
* 文本格式化标签
* 标签属性
* 图像标签
* 链接标签
* 锚点定位
* base标签
* 特殊字符
* 注释标签
* 相对路径/
* 相对路径(一)
* 相对路径(二)
* 列表/
* 无序列表的使用
* 无序列表注意事项
* 有序列表
* 四大名著案例
* 自定义列表
* 第一天HTML总结
* 表单和表单控件/
* 表单的作用
* 文本框和密码框
* 单选按钮和复选按钮
* 默认选中表单属性
* input按钮组
* 最多字符数和文本值
* label标签
* 文本域
* 下拉菜单
* 表单域
* 第二章 页面美容师-CSS/CSS3/
* CSS介绍/
* CSS产生的原因
* CSS网页的美容师
* 体会CSS样式
* CSS样式规则
* font字体/
* 字体样式字号和字体
* 字体字号常用技巧
* unicode字体
* CSS注释
* 字体加粗
* 字体倾斜
* 字体综合设定
* CSS基本选择器/
* 调试工具chrome使用
* 标签选择器
* 体会类选择器
* CSS命名规范
* 谷歌课堂案例
* 多类名选择器
* ID选择器
* id选择器和类选择器的区别
* 通配符选择器
* 链接伪类选择器的使用
* 链接伪类的简写方式
* CSS外观样式及应用/
* CSS颜色
* 行高对齐和首行缩进
* 字间距和单词间距
* 颜色半透明
* 文字阴影初识
* sublime快捷方式
* CSS样式表/
* 内部样式表
* 行内样式表
* 外部样式表
* 三种样式表总结
* 标签显示模式/
* 块级标签显示模式
* 行内标签显示模式
* 行内块元素
* 显示模式转换
* CSS复合选择器/
* 交集选择器
* 并集选择器
* 后代选择器
* 子元素选择器
* 课堂练习-测试选择器
* CSS书写规范
* CSS背景及应用/
* 背景颜色图片及其平铺
* 背景位置（一）
* 背景位置(二)
* 背景附着(固定)
* 背景简写
* 背景半透明
* 背景缩放（一）
* 背景缩放（二）
* 多背景图片
* CSS三大特性/
* CSS层叠性
* CSS继承性
* CSS优先级
* 权重叠加
* 继承的权重为0
* css权重6道精华题
* 优先级总结
* CSS盒模型及应用/
* 看透网页布局本质
* 认识盒子模型组成
* 盒子边框
* 边框综合写法(一)
* 边框综合写法(二)
* 圆角矩形
* 盒子内边距
* 外边距以及盒子居中对齐
* 文字盒子居中图片和背景区别
* 清除内外边距
* 行内元素上下内外边距的问题
* 外边距合并(一)
* 外边距合并(二)
* 盒子的计算尺寸
* padding不影响盒子大小的情况
* 盒子模型布局稳定性
* 浮动及应用/
* 文档流介绍
* 浮动是用来做文字环绕效果的
* 体会浮动
* 浮动就是漂浮的意思
* 浮动首先需要添加标准流父级
* 浮动特性对齐父盒子
* 浮动特性盒子排列
* 浮动影响盒子显示模式
* 浮动总结
* 清除浮动/
* 清除浮动的本质
* 额外标签法
* 父级添加overflow方法
* CSS四种定位及应用/
* 为什么学习定位
* 定位属性
* 静态定位(1)
* 相对定位
* 绝对定位脱标
* 父级没有定位
* 父级有定位
* 何为子绝父相
* 定位练习-哈根达斯
* 绝对定位水平垂直居中
* 固定定位
* 叠加次序
* 定位总结
* 固定绝对定位模式转换
* 第三章 JavaScript基础知识/
* JavaScript介绍/
* 网页、网站和应用程序
* JavaScript的强大
* JavaScript最初的目的
* JavaScript现在的意义
* JavaScript和HTML、CSS的区别，以及组成
* JavaScript初体验
* 计算机组成
* JavaScript变量/
* 什么是变量
* 变量的使用
* 变量命名规则和规范
* 交换两个变量
* JavaScript数据类型/
* 数据类型-Number
* String类型
* Undefined和Null
* typeof和注释
* 转换成字符串类型
* 转换成数值类型1
* 转换成数值类型2
* 转换成布尔类型
* JavaScript操作符/
* 数学运算符
* 一元运算符讲解
* 逻辑运算符
* 关系运算符
* 赋值运算符和运算符的优先级
* JavaScript流程控制及应用/
* 表达式和语句
* 流程控制
* 分支结构
* 分支结构补充和作业
* 三元运算符讲解
* switch
* 成绩转换案例
* 布尔类型的隐式转换
* while循环
* while案例
* dowhile
* dowhile案例
* for循环
* 循环案例1
* 打印正方形
* 打印三角形
* 打印99乘法表
* break和continue
* 调试
* JavaScript数组及应用/
* 数组1
* 数组2
* 数组3
* 求一组数的和和平均值
* 求最大值和最小值-剪裁
* 分隔符
* 筛选数组
* 翻转数组
* JavaScript函数及应用/
* 为什么要有函数
* 函数的参数
* 函数的参数案例-剪裁
* 函数的返回值
* arguments
* 函数案例1-剪裁
* 函数案例2
* 函数案例3
* 函数案例4
* 函数其它概念
* 代码规范
* 作用域
* 作用域链
* 预解析
* 对象概念
* JavaScript对象/
* 对象之字面量
* 创建对象的方式
* new关键字的执行过程
* this
* 遍历对象和删除对象的属性
* 第四章 页面动效实现-WebAPI/
* DOM介绍/
* WebAPI的概念
* JavaScript组成
* DOM相关概念
* 获取页面元素/
* 根据id获取元素-剪裁
* getElementsByTagName1
* getElementsByTagName2
* 获取元素的其它方式
* 注册事件及应用/
* 注册事件
* 点击按钮切换图片
* 非表单元素的属性
* 点击按钮div显示隐藏
* 表单元素的属性
* 给文本框赋值
* 检测用户名和密码
* 样式操作及应用/
* 样式操作1
* 样式操作2
* 开关灯
* 显示隐藏二维码案例
* 高亮显示正在输入的文本框
* 设置大小和位置
* 隔行变色和高亮显示
* BOM介绍及应用/
* BOM
* 对话框
* js中的加载讲解
* setTimeout讲解
* 删除提示讲解
* setInterval讲解
* 第五章 项目实战-在线教育培训网站/
* 项目实战导学/
* 项目实战-教育培训网站导学
* 网站顶部内容实现/
* 顶部内容实现导学
* 项目环境搭建
* 网站顶部结构实现
* PxCook工具下载与使用
* 顶部具体样式（上）
* 顶部具体样式（下）
* 总结
* 网站导航条内容实现/
* 导航条内容导学
* 导航条结构实现
* 导航条样式（1）
* 导航条样式（2）
* 导航条样式（3）
* 总结
* 网站下拉菜单内容实现/
* 下拉菜单导学
* 下拉菜单结构实现
* 下拉菜单定位实现
* 下拉菜单美化
* 下拉菜单显示与隐藏
* 总结
* 网站横向菜单内容实现/
* 横向菜单内容导学
* 横向菜单结构实现
* 横向菜单样式实现
* 横向菜单显示与隐藏
* 总结
* 网站轮播图实现/
* 轮播图-导学
* 轮播图结构实现
* 轮播图图片布局
* 轮播图图片呈现顺序调整
* 解决元素的层级关系
* 在轮播图上添加箭头图标
* 轮播图底部(横向)图标结构创建
* 轮播图底部图标样式设定
* 单击右侧箭头图标，实现轮播图切换
* 实现轮播图循环播放
* 底部图标切换
* 单击左侧箭头图标，实现轮播图切换
* 单击底部图标，完成轮播图切换
* 轮播图自动播放效果实现
* 总结
* 网站优势版块实现/
* 优势版块导学
* 优势版块结构实现
* 优势版块整体样式设计
* 优势版块具体内容样式设定
* 总结
* 网站问题项目版块实现/
* 问题项目版块导学
* 问题项目版块标题区域结构设计
* 问题项目版块标题区域样式设定
* 问题项目版块具体内容结构
* 问题项目版块具体内容版心区域样式
* 问题项目版块具体内容样式设定
* 问题项目版块'预约试听按钮'样式
* 总结
* 网站课程中心版块实现/
* 培训课程中心版块实现导学
* 培训课程中心版块标题区域实现
* 培训课程中心版块课程内容结构
* 培训课程中心版块版心样式设计
* 培训课程中心版块版心文本样式设计（1）
* 培训课程中心版块文本版心样式设计（2）
* 培训课程中心版块'查看详情'样式
* 总结
* 网站解决方案版块实现/
* 解决方案版块导学
* 解决方案版块标题区域结构
* 解决方案版块标题区域样式
* 解决方案版块具体内容结构
* 解决方案版块版心区域样式
* 解决方案版块背景图像添加
* 解决方案版块伪类样式
* 解决方案文本样式
* 总结
* 网站讲师团队版块实现/
* 讲师团队版块导学
* 讲师团队标题区域实现
* 讲师团队版块讲师列表结构
* 讲师团队版块版心区域样式
* 讲师团队版块第一位讲师样式效果
* 讲师团队版块“查看详情”样式实现
* 讲师团队版块讲师列表样式
* 讲师团队版块讲师简介样式
* 讲师团队版块‘查看更多’样式
* 总结
* 网站课程合作案例版块实现/
* 合作案例版块导学
* 合作案例整体结构实现
* 总结
* 网站服务版块实现/
* 服务版块导学
* 服务版块标题结构实现
* 服务版块标题样式
* 服务版本服务内容结构设计
* 服务版块服务内容样式设计
* 服务版块'我们的优势'内容样式设计
* 服务版块’我们的优势‘文本样式
* 总结
* 网站公司介绍版块实现/
* 公司介绍版块导学
* 公司介绍版块结构实现
* 公司介绍版块图片定位
* 公司介绍版块图片样式
* 公司介绍版块文本样式
* 总结
* 网站在线报名版块实现/
* 在线报名版块导学
* 在线报名版块表单创建
* 在线报名版块版心样式
* 在线报名版块表单样式
* 在线报名版块文本样式
* 在线报名表单校验
* 总结
* 网站底部信息版块实现/
* 页面底部版块导学
* 页面底部结构实现
* 页面底部版块文本样式
* 总结
