清華大佬耗費三個月吐血整理的幾百G的資源，免費分享！....>>>

不符合NEC規范的選擇器用法

• .class{}

  不要以一個沒有類別的樣式作為主選擇器，這樣的選擇器只能作為后代選擇器使用，比如.m-xxx .class{}。

• .m-xxx div{}

  不要以沒有語義的標簽作為選擇器，這會造成大面積污染，除非你可以斷定現在或將來你的這個選擇器不會污染其他同類。

• .g-xxx .class{}

  不要在頁面布局中使用后代選擇器，因為這個后代選擇器可能會污染里面的元素。

• .g-xxx .m-yyy{}.g-xxx .u-yyy{}

  不要用布局去控制模塊或元件，模塊和元件應與布局分離獨立。

• .m-xxx .f-xxx{}.m-xxx .s-xxx{}

  不要通過模塊或其他類來重定義或修改或添加已經定義好的功能類選擇器和皮膚類選擇器。

• .m-xxx .class .class .class .class{}

  不要將選擇器寫的過于冗長，這會額外增加文件大小并且限制了太小范圍的選擇器，使樹形結構過于嚴格應用范圍過于局限，建議3-4個長度之內寫完。

  選擇器并不需要完整反映結構嵌套順序，相反，能簡則簡。

• .m-xxx .m-yyy .zzz{}

  不要越級控制，如果.zzz是.m-yyy的后代選擇器，那么不允許.m-yyy之外的選擇器控制或修改.zzz。

  此時可以使用.m-yyy的擴展來修改.zzz，比如.m-yyy-1 .zzz{}。

擴展類使用錯誤

擴展類必須和其基類同時使用于同一個節點。

• 錯誤：class="g-xxx g-yyy-1" class="m-xxx-1" class="u-xxx u-yyy-1" class="xxx-yyy"。
• 正確：class="g-xxx g-xxx-1" class="m-xxx m-xxx-1" class="u-yyy u-yyy-1" class="xxx xxx-yyy"。