一、

 HTML   资料菜鸟教程《学习HTML》http://www.runoob.com/html/html-tutorial.html

CSS      资料菜鸟教程《学习CSS》http://www.runoob.com/css/css-tutorial.html

HTML5(区别 其实就是html的规范)  

资料菜鸟教程《学习HTML5》http://www.runoob.com/html/html5-intro.html

CSS3（区别 新增了一些属性）

资料菜鸟教程《学习 CSS3》http://www.runoob.com/css3/css3-tutorial.html

重点学习内容 （从原理上必须了解透彻）

1 布局

从属性上

 Position布局 （盒子模型）

Float  浮动布局 （float原理）

Flex 弹性布局

Table （h5表格布局）

从作用上

响应式布局

流体布局

点心布局

自适应布局

2 标签语义化（即h5）

  H5是重点

  不要在块级元素只用div 内联元素只用p

要注意标签语义化

HTML到html5最大的变化是增加了很多语义性元素

（作用影响浏览器爬虫抓网页数据等等）

3 h5表单

Css3增加属性最多的地方就是表单属性 每一个属性都要熟练使用

4 CSS3全部属性都要知道

（css3动画学不学看自己，这是一整个大块，学下来也得几个月，主攻css方向的可以细致学一下）

如果学这个看canvas+白鹭

全部学完后建议把css世界这本书看了，都能看懂说明你很强了

时间：上面这些东西真正学会应该得一年左右

效果：网上随便打开一个页面，静态化纯手写能写出来。

二、

1 JavaScript高级程序设计前8章内容

2 HTML DOM  资料http://www.runoob.com/htmldom/htmldom-tutorial.html

3 HTML BOM

4 浏览器

5 JQuery   资料http://www.runoob.com/jquery/jquery-tutorial.html

6 ajax

7 ECMA Script

学习时间一年

效果 深入了解javascript 语言原理运行机制

     深入了解网页载入过程

     深入了解js基本 如原型链、闭包、跨域问题、生命周期

      Jqurry熟练使用

      Ajax 了解原理且熟练使用

      深入了解 面向对象程序编程

      深入了解 MVC 、MVVM设计模式

一定要看JavaScript高级程序设计这本书

Js部分需要通过做项目实战才能真正学通

 

三、

其他学不学都行的内容  学了做项目挺有用，但实际跟你前端水平高不高没一点关系

  Layui

Bootstrap

  Highcharts

  Echarts

另外wevpack前端打包工具学一下                  

四、

前端3大框架   vue.js  react.js  angular.js

三大框架建议大三下学期学一个，angular.js不建议（国内公司用这个用的少）  vue.js相对简单些  react.js和vue.js建议学一个  react全家桶 vue全家桶

我只有vue全家桶的学习资料（视频），学了可以问我要

备注（1、2、3）内容学习不分前后，不分重点，结合着学也行。