Web Development

/ 换个头像心好累 / 0评 / 0/ 最后更新:2022-12-04
css命名规范

不使用id或者属性选择器

为了尽可能的复用class,如小程序wxml和html标签就不同,使用属性就不好复用。

命名遵循bem方法论

虽然写起来有点复杂,但是结构清晰,规范知名度较高,常用的ui组件库均采用bem方法论,如vant,element-plus

通用原子类类名遵循tailwind

tailwind比较流行,有完善的文档,没必要自己再折腾一套偏离主流规范的类名

全局色板变量命名遵循tailwind

--color-primary: #28ba44;

--color-border: #f3f3f3;

--color-text: #202020;

--color-text-2: #878787;

--color-bg: #ffffff;

--color-bg-2: #f2f2f2;

.text-text-2 {

color: var(--color-text-2);

}

全局通用辅助类名g-

对于tailwind原子类不能解决的常用类,可以加g(global)-前缀用于区分

模块通用辅助类名m-

对于仅在某个页面、组件、模块有用的常用类,可以加m(module)-前缀用于区分

0

Leave a Reply

Your email address will not be published. Required fields are marked *