提高你前端水平的 4 个技巧：
做好这四件事情，能让你在大规模使用 CSS 的时候保证代码的健壮性：使用适当的语义，模块化，采用统一的命名规范，遵循单一功能原则。

技巧一、使用适当的语义
（1）在 HTML 和 CSS 编程中有语义标注的概念。语义是指单词的含义和他们间的关系。在 HTML 编程中，意味着你需要使用一个合适的标签名字来标记。
（2）富有语义的 HTML 是非常简单明确的。另一方面，富有语义的 CSS 则是更抽象和主观的。编写富有语义的 CSS 意味着在选择类型的时候，类名要传达出结构和功能信息。类名要很容易被理解。确保它们不要太具体、太特殊。这样，你就可以复用它了。
技巧二：模块化
（1）在这个充满了组件库（以 React 为例）的时代，模块化就是王者。组件就是由已经解构了的接口创建的可组合的模块。下面是一个Product Hunt（一种发布好的创业项目的网站）前端页面
（2）由于 stream 组件和它的子控件是完全独立的，你可以很容易的调整或者更换 post 组件，并且这不会对 stream 组件产生任何影响。

技巧三：采用统一的命名规范
（1）目前有几十个不同版本的 CSS 命名规范。有些人对他们选择的命名规范极其笃定，认为他们的比别人的更好。事实上，不同的人喜欢不同的命名规范。我听到的最好的建议是：选择你觉得最合适的命名规范。
（2）关于命名规范要记住的一件事是，无论你喜欢哪种命名规范，你会经常继承或者工作在不同标准的代码库上。请敞开心扉去学习新的标准，用不同的思维去思考 CSS 。
不妨先抽30秒测试一下看看自己适不适合学习CSS：
http://www.tianhusj.com/list-93-1.html?wm=tb_zzw_pmsj
技巧四：遵循单一功能原则
（1）单一功能原则规定每个模块和类都应该有一个单一的功能，并且该功能应该由这个类完全封装起来。
（2）在 CSS 中，单一功能原则代表每一段代码、类和模块只做一件事。当我们提交 CSS 文件时，这意味着每个独立的组件（例如轮播效果和导航栏）都应该有自己的 CSS 文件。

适合新手

适合新手