H5新特性是必须要掌握的。如果你不需要自己绘图，则canvas等知识点了解即可。要做移动端，浏览器对css3几乎不存在兼容问题，各种流畅的动画效果会为手机端加分不少。移动端常用到的知识点包括：
盒子模型：box-sizing样式；
css选择器：属性选择器；
css布局定位：flex
css动画、过渡：transform、animation
ES5：我并没有去详细的学习ES5的新特性，因为在实际工作中，经常会用到ES5的相关特性但并没有意识到这是ES3还是ES5的范畴。所以，我的建议是，遇到没见过的js语法，可百度现查现学之。有几个新特性还是比较常用的，如下：
响应式布局，概括来说就是页面中元素的布局、尺寸会随着浏览器窗口的大小而改变。html和css3提供了许多支持响应式布局的特性，上文中说到的flex布局、box-sizing盒子模型都是其中之一，但这还远远不够。
推荐教程《网页设计视频教程-响应式手机网站》，
提取码： 5g1c
提取码：q2mh
Bootstrap可以理解为是一套响应式布局的css库，默认只引用一个css文件即可。当然如果你需要用到它的一些控件样式，还需要引用一个js文件。教程的话，Bootstrap中文网中写的很详细了，这里不再赘述。其教程中也包含sass/less相关的内容，用不到的可以不看。
我咨询过很多做前端的朋友，做布局时，如果你有扎实的css布局基础，布局还是自己写的比较好。用第三方的难免会增加根据项目进行定制的苦恼。
如果你的网站图标几乎都是扁平化的单色图标，则字体图标或许是更好的选择。有以下几个有点：
@font-face {font-family: "iconfont";
src: url（'iconfont.eot?t=1483761608434'）;
src: url（'iconfont.eot?t=1483761608434#iefix'） format（'embedded-opentype'），
url（'iconfont.woff?t=1483761608434'） format（'woff'），
url（'iconfont.ttf?t=1483761608434'） format（'truetype'），
url（'iconfont.svg?t=1483761608434#iconfont'） format（'svg'）;
}
不用担心太多，阿里iconfont商店的式的将需要的图标添加到购物车，之后一键导出后的压缩包里有这四个文件和示例代码。
注：
字体图标的编码使用NCR编码的16进制。如下：
。icon-ditu:before { content: “\e601”; }
有时，我们需要写成：“”。
你不需要了解NCR编码，网上相关资料也较少，只需知道在你的字体文件中，每一个（字符）图标都由一个唯一的NCR16进制码表示。
ES5：
ECMAScript5.1中文版，该规范涵盖了所有ES5的特性，而非单列出了新特性，可作为规范参考书用。
|
