御丽诗妃:前端工程师写CSS的通病,你中了几条?内附解决方案

御丽诗妃.以下内容来源于网络,著作权归属原作者。

前端工程师写CSS的通病,你中了几条?内附解决方案

陕西文都智链 2020-08-10 17:24:12

1.CSS简单说明

对于Web的初学者来说,网站不外乎就是HTML和CSS,JS三大板块组合而成,HTML主要是用来负责网络的结构,CSS则是对样式的设计,JS则是交互效果的核心,这篇文章主要讲一下CSS相关的内容,因为CSS本身学习就相对来说比较简单,但是如果如果很容易那就大错特错,入门快,想要精通却非常不易,花时间做项目提升非常重要。

前端工程师写CSS的通病,你中了几条?内附解决方案

 

我们简单从概念上来说,CSS属于层叠样式表,主要用在网页排版设计和装修效果,让网页看起来美观漂亮,对于刚入行的初学者来说,会使用是不难的,但是如果要用的熟练精通,那可并不容易,下面我就说一下常见的通病吧,帮大家排排雷。

2.常见通病

布局不清晰,制作结构混乱,HTML和CSS样式过多

如果对常见板块的设计思路有问题,就会导致做出的效果一致,但是CSS样式和HTML代码标签相对来说比较麻烦,初学者常常会用30行代码来完成10行代码就可以完成的事情。

代码的规范

初学者写出的代码往往只有自己看的懂,让别人来看,可能就是一种煎熬,甚至只能看懂一部分,写代码是一种艺术,写得好叫大神,写的差,也太为难看的人了。作为一个合格的IT从业者,代码应该同出一门,让所有的同行都应该看的懂,如果你写的代码很难辨认,在后期的维护中就会产生非常大的时间浪费。

前端工程师写CSS的通病,你中了几条?内附解决方案

 

命名问题也是常见的问题之一,什么代码风格,不写注释都要改进。首先,命名问题是最大的问题,英文+数字是很多小伙伴喜欢使用的,尽量不要用太奇葩的命名方法,这样就显得非常不专业。

还有就是代码风格的差异,自己写的代码,自己辨认都需要很久,以至于之后再进行维护的时候悔不当初,所以代码一定要注重规范。

前端工程师写CSS的通病,你中了几条?内附解决方案

 

选择器使用不当

选择器的问题就有很多种类了,各种样式那是百花齐放,只有你想不到,没有天马行空的新人做不到,层级之深,样式之复杂,看的你直掉头发。

属性的认识不够深刻

真正麻烦的时候开始了,由于初学者的项目实操丰富度不是很高,所以对常见属性的使用也并不是非常的完美,对CSS的使用会有知识点的盲区,写出来的效果就会差强人意。可用性不高,性能也许也比较低下。

不理解CSS组件开发

最后重点说一下制作效果不可以重复的问题,对于经验比较少的朋友来说,仅仅看到当前的直观样式是不清楚的,一个网站的整体结构,做出来的效果,样式的复写率就会比较高,无法对整体的结构和样式有一个完全的认知,在复写样式的过程中花费较多的时间,看起来是满足当前板块的需求,实则非常影响整体网页的性能。

前端工程师写CSS的通病,你中了几条?内附解决方案

 

3.解决方案

学会使用开发手册

学会用API开发手册是非常重要的,当对于属性的认知并不深刻的时候,多多查询是非常有好处的, 可以说是前端开发的宝典了。

多解读前端经典UI框架源码

多在网上学习经典UI框架,比如bootstrap layUI等等,学习样式写法,代码的编写风格,命名的格式。

多参与商业级网站实战或仿站

这个的目的在于让初学者多参与同类型或不同类型的设计,多参考学习写法和制作思路,加快学习脚步,尽早做到提升。

Github开源项目

最后可以给大家分享一个比较好用的github,类似的这个平台也非常多,这些个代码仓库是一个不错的学习平台,多多学习,多多提升,对新手的帮助非常大。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章