近几天在编写页面，自己感觉编码效率低下，正所谓穷则思变，当意识到问题必须得以解决时，往往就迈出了解决问题的第一步。
自己在编写页面主要遇到的问题如下：页面结构更改频繁，CSS样式复用少且维护困难。大项目遇到难以维护等问题倒是情有可原，但这只是一个小项目，出现这种问题只能是因为我的编码姿势不对，某些地方存在自己没意识的问题。
编写CSS样式的时候，为了避免类命名的冲突、样式覆盖的问题，我在一定程度上借鉴了BEM的编写规范，不过对提高自己的编码效率作用不大。使用网络搜索相关主题，结合自己的实际情况，该问题又细分为几个小问题，如下：1、CSS类命名，2、CSS样式复用，3、易读可维护。
解决方案如下：
1、在前端开发组件化、模块化的基础上使用BEM编码规范的命名方法，部分借鉴SMACSS的命名方法。
2、借鉴DRY的思想，利用CSS预编译语言中的变量、混入、拓展等特性实现样式的复用，费类名的复用。
3、注重项目结构的优化。
近几天在编写页面，自己感觉编码效率低下，正所谓穷则思变，当意识到问题必须得以解决时，往往就迈出了解决问题的第一步。...
本文主要参考MDN|编写高效的CSS、译文编写高性能高质量的CSS代码、《高性能网站建设指南》、谷歌|优化性能、《...
群组选择器的嵌套 '>'子组合选择器 属性的嵌套 导入Sass文件 当你在一个sass文件中声明了一个属性（比如一...
平常项目中遇到的css不常用语法整理 css问题解决及说明相关网址 前端CSS规范整理 -- 标点符 编写高效的C...
知识点：企业布局技巧，如何高效的编写CSS样式，常用选择器，基本标签，盒子模型，jquery类库调用，JS特效编写...
什么是less less就是一门css预处理器，使我们可以以一种更高效的方式编写css 怎么使用less 在vs ...
css代码编写方式 嵌入编写 将css代码写在html代码文件中 必须将css代码写在style标记中（style...
知识点：企业布局技巧，如何高效的编写CSS样式，常用选择器，基本标签，动态布局，盒子模型，jquery类库调用，J...
什么是CSS-in-JS？ 顾名思义，CSS-in-JS就是可以使用JS来编写CSS样式，那么为什么要用JS来编写...
编写模块化CSS：BEMhttps://www.w3cplus.com/css/css-architecture-...
本文标题：高效编写CSS
本文链接：https://www.haomeiwen.com/subject/psywqqtx.html
网友评论