<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<style>
#myDIV
{
width:100px
height:100px
position:relative
}
@keyframes mymove
{
0% {}
100% {-webkit-transform:rotate(360deg)}
}
#mybak{
position:absolute
left:0
top:0
width:100px
height:100px
background:black
-webkit-animation:mymove 10s infinite
}
#mynum{
position:absolute
left:0
top:0
width:100px
height:100px
text-align:center
color:white
font-size:70px
line-height:100px
}
</style>
</head>
<body>
<div id="myDIV"><div id="mybak"></div><div id="mynum">10</div></div>
</body>
</html>
首先要学习前端页面重构。包括PC端网站布局、HTML5+CSS3基础、WebApp页面布局等等，打好前端开发的基础。然后要学JavaScript高级程序设计、PC端全栈开发的知识。包括原生JavaScript交互功能开发、面向对象进阶与ES5/ES6/ES7应用、JavaScript工具库自主研发、jQuery经典交互特效开发、PHP+MySQL后端基础、前端工程化与模块化应用等。
前面的知识都掌握了，就可以学框架、混合开发了。包括Node.js后端开发、Vue.js前端框架、React前端框架、混合开发(Hybrid,RN)、Angular前端框架等等。学习前端一定要有清晰的学习路线，掌握有效率的学习方法。
基础性的学习网站：
w3school：http://www.w3school.com.cn/
w3cplus：www.w3cplus.com
MDN网站 ：https://developer.mozilla.org/zh-CN/docs/Web
菜鸟教程网：http://www.runoob.com
易百教程：http://www.yiibai.com/
脚本之家：http://www.jb51.net
视频类的学习网站：
尚学堂：http://www.bjsxt.com/
慕课网：https://www.imooc.com/
扣丁课堂：https://www.codingke.com/
极客学院：http://www.jikexueyuan.com/
腾讯课堂：https://ke.qq.com/
51cto：http://edu.51cto.com/courselist/index.html
实验楼：https://www.shiyanlou.com/
网易云课堂：http://study.163.com/
我要自学网：http://www.51zxw.net/
个人博客类的学习网站：
张鑫旭：http://www.zhangxinxu.com/
阮一峰：http://www.ruanyifeng.com/home.html
廖雪峰：https://www.liaoxuefeng.com/
辰辰：http://www.chennoted.com/
轩枫阁：http://www.xuanfengge.com/
社区类的学习网站：
segmentfault：https://segmentfault.com/
掘金：https://juejin.im/
简书：https://www.jianshu.com/
WEB前端-伯乐在线：http://web.jobbole.com/
Stack Overflow:https://stackoverflow.com/
CSDN：https://www.csdn.net/
博客园：https://www.cnblogs.com/
开发者头条：https://toutiao.io/
