我发现前端开发者一直在努力征服CSS。并且有充分的理由,开发人员是合乎逻辑的生物。添加一个DIV元素导致所有代码都必须向下移动一行,而另一个DIV向左“浮动”,感觉没有任何意义。你一定也听过开发者的抱怨:“我们只需要向左移动五个像素,但是……天哪!为什么整个东西都往下移动了一行。这到底是哪里错了?!?!?!”根据我作为前端开发人员使用CSS的经验,这里是我的十个不应该做的事情。1不要滥用类在有意义的地方使用ID而不是类。这是浏览器更快访问DOM元素的一种方式。2不要将所有内容都放入一个CSS文件中对CSS进行分区以使其更易于管理。每个CSS文件都可以分解为header.css、footer.css等逻辑组件。3不要将选择器命名为“.red-with-green-dashed-lines”(red-with-green-dashed-lines)根据页面上的组件命名您的选择器。例如:“header-left”、“content-title”或“content-date”更具描述性。4不要忘记注释注释在CSS中非常重要,可以理解每种样式如何与其他样式相关以及哪些颜色方案适用于哪些组件。5.不要害怕开发工具。现在每个浏览器都有自己的一套开发工具,通常是按F12。当谈到“调试CSS”时,这些工具是至关重要的。6.不要害怕重写当然,像Bootstrap和Foundation这样的CSS框架非常庞大,但每个都需要根据您的需要进行一些微调。当您获得更新的框架时,它将覆盖您的更改。与其深入研究一个巨大的css文件,不如创建一个bootstrap-overrides.css文件,根据需要调整框架,然后...7不要滥用!重要CSS的整个思想是将样式从一个样式“级联”到另一个样式。!关键是要记住像我一样遍历所有以前的模式。:-)8不要使用很多网络字体这也是显而易见的,但有些人只是喜欢自己排版。在您的网站上仅使用一种或两种(最多三种)网络字体并退回到浏览器默认设置以保持您的网站优化。9.不要手动编写所有CSS。要保持CSSDRY,请使用LESS或SASS等CSS预处理器。使用这些预处理器的好处在于,您可以在它们上面定义变量,例如配色方案,然后将它们重新用于所有CSS,而无需在需要更改它们时追踪每种颜色。10不要让CSS太“臃肿”空格会占用CSS文件中的空间。由于我们都希望我们的CSS能够快速加载,因此在部署到网站之前使用CSS压缩器将其精简是个好主意。以上只是我作为一个开发者认为在编写CSS时不应该做的事情。希望对各位前端同仁有所帮助!
