美文网首页
CSS命名相关的解决方案

CSS命名相关的解决方案

作者: kim_jin | 来源:发表于2019-04-08 11:58 被阅读0次

注意事项:
1.再写代码样式的时候,必须进行嵌套,在一个html文件中要有一个最上层的class,作为这个页面的父级元素。
2.在取类名的时候,划分要用中划线
3.对于块级元素要有变量名。
对于颜色相关的命名,我们要方便后面的换主题色,所以颜色采用变量的模式。
先定义一个color的文件,这个文件中我们定义的是颜色的名字和颜色的值进行一一对应:

color.less

定义一个index.js文件,这个文件让颜色名,和一个无关功能的变量名进行对应:

index.less

定义一个variable的变量文件,让功能色和index中的无关变量的名字进行对应

variable.less

优点:这样操作的意义是,当我们更换主题色的时候,只要把color文件中的颜色词条进行修改,对应的index中的关键字对应的值进行修改,就可以实现我们要的效果,不用修改原来功能文件中的htmlless文件。

css命名:

常用CSS命名规则 页面结构 导航 功能

相关文章

网友评论

      本文标题:CSS命名相关的解决方案

      本文链接:https://www.haomeiwen.com/subject/buruiqtx.html