之前没有任何代码基础，想通过自学学会基础的CSS样式，如何高效自学CSS？

html-css010

之前没有任何代码基础，想通过自学学会基础的CSS样式，如何高效自学CSS？,第1张

1、初期不要急着自己去设计页面，直接仿站来让自己获得从0到1的能力。 找一些比较有新意的，结构上稍有复杂度的，基本没切过有高相似度的页面，时间要花在刀刃上。确实培养起了自己对CSS的兴趣。

2、基础技能练习差不多了，可以找份真实的工作来巩固深入学习。比你自己业余去摸索要高效10倍。理解了CSS模块化的思想，才发现自己以前只能算是完成了一个页面，而不算是做好了它。真实的产品开发才是自己的CSS能力真正落地的开始。

3、工作后应继续关注相关一些例如Codrops 等这类能带来CSS使用灵感的网站，去思考为什么，而不是copy它的代码去完成功能。页面开发中有太多重复的工作，如果你一直用一个思路去解决问题，会有碍于经验和能力的积累，形成一个较低级舒适区的怪圈。平时也可以去codepen这类网站收集一些琐碎的灵感，增加知识面学习css过程中千万不要剥离HTML学习。当什么时候理解了html的重要性（从页面开发角度而言，它可以视为是后续良好css和js编码得以实施的基础，相当于程序中的数据结构，设计好了可以让你事半功倍），你才可以称得上是一个合格的页面开发

4、对于新人，建议除了几个关键概念，如布局、盒模型、单位等等，都不应该花大量去扣细节，甚至背书记忆，浏览性学习知道有这个东西就行，在实际应用时再去加深记忆。

以上算抛砖引玉，虽然一直认为纯粹的CSS页面开发并不适合作为前端领域里深入发展的方向，但不可否认，在学习玩耍css的过程中，带给了自己很多乐趣。

学习分为两种，

一种是全面系统的学习，这种情况下需要找一些系统的资料，比如教学资料，书籍，系列视屏等。

另外一种是需求驱动学习，指的是当你需要用到某一方面并不熟悉知识的时候，有针对性的去进行学习，这样的学习针对性强，记忆深刻。

此外推荐一些B站上比较有意思的CSS视屏UP主：

Microgoople 网页链接 主要发布一些漂亮的或者奇思妙想的 CSS 视屏。录制了代码编写的全过程。比较有意思。适合 CSS 初学者。

前端实验室 网页链接 同样以好看的前端样式为主。