BEM的意思就是塊（block）、元素（element）、修飾符（modifier）,是由Yandex團隊提出的一種前端命名方法論。這種巧妙的命名方法讓你的CSS類對其他開發者來說更加透明而且更有意義。BEM命名約定更加嚴格，而且包含更多的信息，它們用于一個團隊開發一個耗時的大項目。 命名約定的模式如下： ```css .block{} .block__element{} .block--modifier{} ``` .block 代表了更高級別的抽象或組件。 .block__element 代表.block的后代，用于形成一個完整的.block的整體。 .block--modifier代表.block的不同狀態或不同版本。 在項目中，我們使用smacss配合bem完成css的規劃組合 命名規則如下 1. smacss規定五中類型，其中皮膚類和初始化類獨立處理，另外三類規定命名前綴 2. 布局類 以.l開頭中劃線鏈接具體布局名 3. 模塊類 以.m開頭中劃線鏈接具體模塊名 4. 狀態類 以--后鏈接具體狀態名字 實例如下 ```html <header class="l-header"> <nav class="m-nav"> <ul class="m-nav_compent"> <li class="m-nav_children"> <span class="m-nav_list--red"> </span> </li> </ul> </nav> </header> ```