个人代码风格习惯-标签命名

mac2022-06-30  93

在后期需要二次维护的项目中,CSS类名命名规范也是一种问题,常见的命名规范是BEM规范,B(block)即模块,E(element)即元素,M(modifier)即修饰符:

举个栗子:

1 <!-- S Search Bar 模块 --> 2 <div class="search-bar"> 3 <input class="search-form__input"/> 4 <!-- / input 输入框子元素 --> 5 <button class="search-form__button"></button> 6 <!-- / button 搜索按钮子元素 --> 7 </div> 8 <!-- E Search Bar 模块 -->

但是鄙人认为这种命名规范中的-和_过于繁琐,所以我的命名习惯一般是基于驼峰命名法的直接父级元素类名+子元素的功能含义英文:

举个栗子:

1 <!-- S Search Bar 模块 --> 2 <div class="searchBar"> 3 <input class="searchBarInput"/> 4 <!-- / input 输入框子元素 --> 5 <button class="searchBarBtn"></button> 6 <!-- / button 搜索按钮子元素 --> 7 </div> 8 <!-- E Search Bar 模块 -->

 

转载于:https://www.cnblogs.com/zhangxin123/p/11598238.html

最新回复(0)