前端知识归纳（3）-- HTML/CSS（part5 知识图谱）

知识图谱

首先对我们学过的知识进行一个简单的图谱总结，以方便大家系统认识及查漏补缺：

[图片上传失败...(image-4810cf-1547689941510)]

由于 CSS 脑图图片比较大，如图片不清晰，可新窗口打开图片或查看 CSS 脑图高清版。

[图片上传失败...(image-ae9894-1547689941510)]

CSS 标准、支持及未来

然后在整个课程中，我们模糊了 CSS2 与 CSS3 的界限，而是统一称为 CSS，也很少刻意去说兼容的问题，这是因为 CSS3 已经出来很多年了，浏览器的发展也非常迅猛，所有的不兼容都是暂时的，最终我们将迎来空前的繁盛。

从 CSS3 开始 CSS 属性是按照功能模块来分开开发的，每个模块开发完毕就会进入下一个版本，这样持续更新迭代发展，而整个 CSS 的大版本还是一致保留在 3 这个阶段，所以不存在 CSS4，但是存在某个模块版本的4，5，6...

• CSS Working Group Editor Drafts
• CSS3 test
• Can I use
• Houdini：也许是你从未听过的在CSS领域最令人兴奋的发展

CSS 规范

如果你有一些代码洁癖，或者进入某个团队，然后发现大家的代码风格各不相同，维护代码时一团乱麻，这个时候一份统一的规范就很有用了。规范相对来说比较灵活，各个团队可以根据自己团队制定不同的规范，下面是一些规范推荐：

• 推荐大家使用的CSS书写规范、顺序
• [译]谷歌 HTML/CSS 规范
• CSS编码规范

个人经验与推荐

常逛站点

• CSS Weekly
• CSS Trick
• Smashing magazine
• Sitepoint
• codrops
• MDN
• W3cplus
• Codepen（在线编辑代码工具）

个人重构经验

• HTML 整站结构设计
• HTML 结构的拆与合
• CSS 设计中的不变与可变
• class 命名方法
• sheral 移动端重构
• 重构优秀教程合集

书籍推荐

• 《CSS 权威指南》：本书内容主要是 CSS2，虽然 CSS3 部分只涉及了一些选择器，但是对于基础、原理什么的讲解得非常好，非常值得入门。
• 《图解 CSS3》：本书是 w3cplus 站长所写，由于 CSS3 的发展比较快，所以书中有些内容都已经过时，不过最近作者正在升级更新第二版，建议到时入手。
• 《CSS揭秘》：本书是集 CSS 经验技巧的大成之作，里面有作者的各种经验及感悟，非常值得入手。
• 《响应式Web设计：HTML5和CSS3实战（第2版）》：看书名就知道是讲响应式的，对响应式理解不是很深的可以入手。
• 《SVG 精髓》：从入门到精通，全方位涵盖 SVG 技术，你值得拥有。目前最新版本为第二版。