教学大纲

了解前端，对前端有整体认识

工具（webstorm、photoshop、markdown）从安装到使用

html基础及html实战

1、标签和标签属性
2、元素及元素分类
3、网页基本结构解析
4、标签语义化

CSS基础及css实战

• css引入方式
• css选择器
• 权重
• css属性继承
• background属性的使用技巧
• 雪碧图的使用技巧
• 常见的兼容性处理

CSS盒子模型

• 盒子模型的值——利用border实现三角形效果
• 盒子模型的计算公式
• 盒子模型的兼容问题

浮动

• 浮动的原理
• 浮动产生的影响
• 清除浮动的几种方式

定位

• 绝对定位
• 相对定位
• 固定定位
• 层级关系

动画

• transition过渡动画
• animation简易动画
• 雪碧图动画
• 开关门动画
• 人物场景动画

学习工具

sublime text
photoshop
马克飞象（markdown）
印象笔记

常用浏览器

• 谷歌浏览器（chrome）：webkit内核（v8引擎）
• 火狐浏览器（firefox）：gecko内核
• IE浏览器：trident内核
• 欧朋浏览器（opera）：presto内核
• safari、大部分国产浏览器（360、搜狗、qq、uc、猎豹、百度、、、）、安卓和ios大部分手机浏览器

各大公司面试题解析

• 利用border实现三角形效果（不允许使用图片）（百度）
• 一个元素如何在另一个元素中始终水平垂直居中（凤凰网）
• 如何让元素消失在视野中，发挥想象力（腾讯网）
• 多个元素在一行显示的方法（搜狐网）
• 三栏布局，左定右定中间自适应的实现方法（网易）
• 行内元素和块状元素分别有什么，区别是什么（乐视网）