CSS 中 BEM命名方式

BEM的意思就是塊（block）、元素（element）、修飾符（modifier），是一種CSS Class 命名方法。

相似於：

.block{} .block__element{} .block--modifier{}

__雙下劃線表明B和E鏈接例如 menu __item
_單下劃線表明B和M或E和M的鏈接 例如 menu _active 或 menu__item _active
-中劃線同英語裏作連字符例如 mod-menu 或 mod-menu__item 這裏 B或E或M須要多個單詞來描述,就使用中劃線

瞭解什麼是 B.E.M

Block
將全部東西都劃分爲一個獨立的模塊,一個header是block,header裏嵌套的搜索框是block,甚至一個icon一個logo也是block
block能夠相互嵌套

Element
一個Block下的全部Element不管相互層級如何,都要攤開扁平的屬於Block
因此 BEM 最多隻有 B+E+M 三級,不可能出現 B+E+E+..+E+M 超長class名,也要求E不能同名

Modifier
以前咱們常常寫的 .current .active 等表達狀態