遇到问题
团队开发中css的命名冲突
为css的命名而绞尽脑汁
css的命名五花八门
解决方案
使用规范：BEM
BEM是一种CSS命名规范。
BEM代表 “块（block），元素（element），修饰符（modifier）”]
eg:
.list__item_active{}
__ 双下划线：双下划线用来连接块和块的子元素
_ 单下划线：单下划线用来描述一个块或者块的子元素的一种状态
实例对比
//通常我写法
- 光明之子
- 冥王之子
.box{}
.box .item{}
.box .item.active{}
================================
================================
//BEM写法
- 光明之子
- 冥王之子
.box{}
.box__item{}
.box__item_active{}
总结
1.命名冲突
因为子元素不是单独的一个命名，而是包含了他的父级元素，这样命名冲突就降低了很多
【就像我们读书的时候：一个学校加"李伟"的人有多个，但是如果没有前缀修饰，就不知道是哪个"李伟"，但是如果加上班级，一班的李伟和二班的李伟，这样就很好的解决了冲突】
2.命名有了规范，开发人员命名起来就简单一些
【就像我们要写年终总结，给你模板和不给你模板，两个一对比就很明显了】
3.结构逻辑，易于阅读
【有了规范，我们直接看类名是不是就能知道元素的】
4.css查找层级明显减少
【之前可能需要四五级的查找，现在直接一个类名就可以，是不是提升了css解析的效率】